Browse Source

fix: `watch` build regressions

- error when deleting an already deleted html file
- removed extraction+inlining of CSS as it doesn't work
tophf 4 years ago
parent
commit
3876eaa2f9
2 changed files with 9 additions and 7 deletions
  1. 4 4
      scripts/plaid.conf.js
  2. 5 3
      scripts/webpack.conf.js

+ 4 - 4
scripts/plaid.conf.js

@@ -73,7 +73,10 @@ exports.optimization = {
     },
   },
   minimizer: isProd && [
-    // apply `postcss-combine-media-query`
+    /* Combining @media (prefers-color-scheme: dark) into one query.
+     * WARNING! html-inline-css-webpack-plugin doesn't detect CSS from mini-css-extract-plugin
+     * in `watch` build so it's only enabled in prod. If we see a difference between the two,
+     * we should remove this plugin or fix the above-mentioned problem. */
     new OptimizeCssAssetsPlugin({
       cssProcessor: require('postcss')([
         require('postcss-combine-media-query'),
@@ -100,6 +103,3 @@ exports.optimization = {
     }),
   ],
 };
-exports.styleOptions = {
-  extract: true, // Will be embedded as <style> to ensure uiTheme option doesn't cause FOUC
-};

+ 5 - 3
scripts/webpack.conf.js

@@ -3,7 +3,7 @@ const { isProd } = require('@gera2ld/plaid/util');
 const fs = require('fs');
 const webpack = require('webpack');
 const WrapperWebpackPlugin = require('wrapper-webpack-plugin');
-const HTMLInlineCSSWebpackPlugin = require('html-inline-css-webpack-plugin').default;
+const HTMLInlineCSSWebpackPlugin = isProd && require('html-inline-css-webpack-plugin').default;
 const projectConfig = require('./plaid.conf');
 const mergedConfig = shallowMerge(defaultOptions, projectConfig);
 
@@ -70,7 +70,7 @@ module.exports = Promise.all([
     /* Embedding as <style> to ensure uiTheme option doesn't cause FOUC.
      * Note that in production build there's no <head> in html but document.head is still
      * auto-created per the specification so our styles will be placed correctly anyway. */
-    config.plugins.push(new HTMLInlineCSSWebpackPlugin({
+    if (isProd) config.plugins.push(new HTMLInlineCSSWebpackPlugin({
       replace: {
         target: '<body>',
         position: 'before',
@@ -91,7 +91,9 @@ module.exports = Promise.all([
               JSON.stringify(manifest, null, isProd ? 0 : 2),
               {encoding: 'utf8'});
           }
-          fs.unlinkSync(`${dist}/${bgId}.html`);
+          try {
+            fs.unlinkSync(`${dist}/${bgId}.html`);
+          } catch (e) {}
         });
       }
     });