ubuntu.com/postcss.config.js at main · Ninfa-Jeon/ubuntu.com · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
const purgeCSSPlugin = require("@fullhuman/postcss-purgecss");

/** @type {import('postcss-load-config').Config} */
let config = {
  plugins: [
    require("autoprefixer"),
    purgeCSSPlugin({
      content: [
        "templates/**/*.html",
        "static/**/*.js",
        "static/*.js",
        "static/*.jsx",
        "static/*.md",
        "static/*.tsx",
        "static/*.xml",
        "templates/templates/**/*.html",
        "static/**/*.{js,jsx,ts,tsx,md,xml}",
        "templates/**/*.jinja",
        "static/**/*.tsx",
        "webapp/**/*.py",
        "templates/**/*.md",
        "templates/**/*.py",
        "templates/**/*.xml",
        "node_modules/@canonical/cookie-policy/build/js/cookie-policy.js",
        "node_modules/flickity/dist/flickity.pkgd.min.js",
        "node_modules/@canonical/global-nav/dist/global-nav.js",
        "node_modules/@canonical/latest-news/dist/latest-news.js",
        "node_modules/intl-tel-input/build/js/utils.js",
        "node_modules/vanilla-framework/templates/**/*.jinja",
        "node_modules/leaflet/dist/leaflet.js",
      ],
      defaultExtractor: (content) => content.match(/[\w-/:]+(?<!:)/g) || [],
      extractors: [
        {
          extractor: (content) => {
            const matches = content.match(/class=["']([^"']+)["']|class=([^\s>]+)|class:\s*{([^}]+)}/g) || [];
            return matches.map(match => {
              return match.replace(/class=["']|class=|class:\s*{|["'}]/g, '').split(/\s+/);
            }).flat();
          },
          extensions: ['html']
        }
      ],
      safelist: {
        standard: [
          /^cookie-policy/,
          /^form/,
          /^p-/, // Preserve form related classes
          /^u-/, // Utility classes
          /^is-/,
          /^js-/, // JavaScript-related classes
          /^leaflet-/,
        ],
        greedy: [
          /^iti/,
          /^mktoForm/, // Marketo forms
          /^cc-/, // Cookie consent related
          /^optanon/, // Cookie consent related
          /^has-/, // State-related classes
        ],
        deep: [/form-.+/],
        keyframes: true,
        variables: true,
      },
    }),
  ],
};

module.exports = config;