Install PurgeCSS

package-lock.json

@@ -770,6 +770,15 @@
                 "to-fast-properties": "^2.0.0"
             }
         },
+        "@fullhuman/postcss-purgecss": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-1.3.0.tgz",
+            "integrity": "sha512-zvfS3dPKD2FAtMcXapMJXGbDgEp9E++mLR6lTgSruv6y37uvV5xJ1crVktuC1gvnmMwsa7Zh1m05FeEiz4VnIQ==",
+            "requires": {
+                "postcss": "^7.0.14",
+                "purgecss": "^1.4.0"
+            }
+        },
         "@inertiajs/inertia": {
             "version": "0.1.7",
             "resolved": "https://registry.npmjs.org/@inertiajs/inertia/-/inertia-0.1.7.tgz",
@@ -7257,6 +7266,84 @@
             "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz",
             "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A=="
         },
+        "purgecss": {
+            "version": "1.4.2",
+            "resolved": "https://registry.npmjs.org/purgecss/-/purgecss-1.4.2.tgz",
+            "integrity": "sha512-hkOreFTgiyMHMmC2BxzdIw5DuC6kxAbP/gGOGd3MEsF3+5m69rIvUEPaxrnoUtfODTFKe9hcXjGwC6jcjoyhOw==",
+            "requires": {
+                "glob": "^7.1.3",
+                "postcss": "^7.0.14",
+                "postcss-selector-parser": "^6.0.0",
+                "yargs": "^14.0.0"
+            },
+            "dependencies": {
+                "ansi-regex": {
+                    "version": "4.1.0",
+                    "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
+                    "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg=="
+                },
+                "cssesc": {
+                    "version": "3.0.0",
+                    "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
+                    "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg=="
+                },
+                "postcss-selector-parser": {
+                    "version": "6.0.2",
+                    "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.2.tgz",
+                    "integrity": "sha512-36P2QR59jDTOAiIkqEprfJDsoNrvwFei3eCqKd1Y0tUsBimsq39BLp7RD+JWny3WgB1zGhJX8XVePwm9k4wdBg==",
+                    "requires": {
+                        "cssesc": "^3.0.0",
+                        "indexes-of": "^1.0.1",
+                        "uniq": "^1.0.1"
+                    }
+                },
+                "string-width": {
+                    "version": "3.1.0",
+                    "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
+                    "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
+                    "requires": {
+                        "emoji-regex": "^7.0.1",
+                        "is-fullwidth-code-point": "^2.0.0",
+                        "strip-ansi": "^5.1.0"
+                    }
+                },
+                "strip-ansi": {
+                    "version": "5.2.0",
+                    "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
+                    "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
+                    "requires": {
+                        "ansi-regex": "^4.1.0"
+                    }
+                },
+                "yargs": {
+                    "version": "14.2.2",
+                    "resolved": "https://registry.npmjs.org/yargs/-/yargs-14.2.2.tgz",
+                    "integrity": "sha512-/4ld+4VV5RnrynMhPZJ/ZpOCGSCeghMykZ3BhdFBDa9Wy/RH6uEGNWDJog+aUlq+9OM1CFTgtYRW5Is1Po9NOA==",
+                    "requires": {
+                        "cliui": "^5.0.0",
+                        "decamelize": "^1.2.0",
+                        "find-up": "^3.0.0",
+                        "get-caller-file": "^2.0.1",
+                        "require-directory": "^2.1.1",
+                        "require-main-filename": "^2.0.0",
+                        "set-blocking": "^2.0.0",
+                        "string-width": "^3.0.0",
+                        "which-module": "^2.0.0",
+                        "y18n": "^4.0.0",
+                        "yargs-parser": "^15.0.0"
+                    }
+                },
+                "yargs-parser": {
+                    "version": "15.0.0",
+                    "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-15.0.0.tgz",
+                    "integrity": "sha512-xLTUnCMc4JhxrPEPUYD5IBR1mWCK/aT6+RJ/K29JY2y1vD+FhtgKK0AXRWvI262q3QSffAQuTouFIKUuHX89wQ==",
+                    "requires": {
+                        "camelcase": "^5.0.0",
+                        "decamelize": "^1.2.0"
+                    }
+                }
+            }
+        },
         "q": {
             "version": "1.5.1",
             "resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz",

package.json

@@ -10,6 +10,7 @@
         "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
     },
     "dependencies": {
+        "@fullhuman/postcss-purgecss": "^1.3.0",
         "@inertiajs/inertia": "^0.1.0",
         "@inertiajs/inertia-vue": "^0.1.0",
         "axios": "^0.18",

webpack.mix.js

@@ -2,6 +2,7 @@ const cssImport = require('postcss-import')
 const cssNesting = require('postcss-nesting')
 const mix = require('laravel-mix')
 const path = require('path')
+const purgecss = require('@fullhuman/postcss-purgecss')
 const tailwindcss = require('tailwindcss')
 
 /*
@@ -16,11 +17,21 @@ const tailwindcss = require('tailwindcss')
  */
 
 mix.js('resources/js/app.js', 'public/js')
-  .postCss('resources/css/app.css', 'public/css', [
+  .postCss('resources/css/app.css', 'public/css/app.css')
-    cssImport(),
+  .options({
-    cssNesting(),
+    postCss: [
-    tailwindcss('tailwind.js'),
+      cssImport(),
-  ])
+      cssNesting(),
+      tailwindcss('tailwind.js'),
+      ...mix.inProduction() ? [
+        purgecss({
+          content: ['./resources/views/**/*.blade.php', './resources/js/**/*.vue'],
+          defaultExtractor: content => content.match(/[\w-/:.]+(?<!:)/g) || [],
+          whitelist: ['nprogress'],
+        }),
+      ] : [],
+    ],
+  })
   .webpackConfig({
     output: { chunkFilename: 'js/[name].js?id=[chunkhash]' },
     resolve: {