fix(tailwind): Ensure tailwind properly purges unused utility classes (#2485)

platform/viewer/.webpack/webpack.pwa.js

@@ -7,11 +7,9 @@ const webpackBase = require('./../../../.webpack/webpack.base.js');
 // ~~ Plugins
 const { CleanWebpackPlugin } = require('clean-webpack-plugin');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
-const ExtractCssChunksPlugin = require('extract-css-chunks-webpack-plugin');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const { InjectManifest } = require('workbox-webpack-plugin');
-// ~~ Rules
-const extractStyleChunksRule = require('./rules/extractStyleChunks.js');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 // ~~ Directories
 const SRC_DIR = path.join(__dirname, '../src');
 const DIST_DIR = path.join(__dirname, '../dist');
@@ -39,9 +37,6 @@ module.exports = (env, argv) => {
       filename: isProdBuild ? '[name].bundle.[chunkhash].js' : '[name].js',
       publicPath: PUBLIC_URL, // Used by HtmlWebPackPlugin for asset prefix
     },
-    module: {
-      rules: [...extractStyleChunksRule(isProdBuild)],
-    },
     resolve: {
       modules: [
         // Modules specific to this package
@@ -81,12 +76,6 @@ module.exports = (env, argv) => {
           },
         ],
       }),
-      // https://github.com/faceyspacey/extract-css-chunks-webpack-plugin#webpack-4-standalone-installation
-      new ExtractCssChunksPlugin({
-        filename: isProdBuild ? '[name].[hash].css' : '[name].css',
-        chunkFilename: isProdBuild ? '[id].[hash].css' : '[id].css',
-        ignoreOrder: false, // Enable to remove warnings about conflicting order
-      }),
       // Generate "index.html" w/ correct includes/imports
       new HtmlWebpackPlugin({
         template: `${PUBLIC_DIR}/html-templates/${HTML_TEMPLATE}`,
@@ -131,7 +120,14 @@ module.exports = (env, argv) => {
     mergedConfig.devServer.proxy[PROXY_TARGET] = PROXY_DOMAIN;
   }
 
-  if (!isProdBuild) {
+  if (isProdBuild) {
+    mergedConfig.plugins.push(
+      new MiniCssExtractPlugin({
+        filename: '[name].bundle.css',
+        chunkFilename: '[id].css',
+      })
+    );
+  } else {
     mergedConfig.plugins.push(new webpack.HotModuleReplacementPlugin());
   }