4 년 전 · a7d51275ab
--- a/.postcssrc.js
+++ b/.postcssrc.js
@@ -1,5 +1,15 @@
 
				 const cfg = require('@gera2ld/plaid/postcss/precss')({});
			
 
				-cfg.plugins[1] = require('precss')({
			
 
				-  features: { 'prefers-color-scheme-query': false },
			
 
				-});
			
 
				+const manifest = require('./dist/manifest.json');
			
 
				+const minChrome = parseInt(manifest.minimum_chrome_version);
			
 
				+const minFirefox = parseInt(manifest.browser_specific_settings.gecko.strict_min_version);
			
 
				+if (minChrome < 76 || minFirefox < 67) {
			
 
				+  // Disabling `prefers-color-scheme` polyfill because we use our own one
			
 
				+  cfg.plugins.forEach((p, i) => {
			
 
				+    if ((p.postcss || {}).postcssPlugin === 'precss') {
			
 
				+      cfg.plugins[i] = require('precss')({
			
 
				+        features: { 'prefers-color-scheme-query': false },
			
 
				+      });
			
 
				+    }
			
 
				+  });
			
 
				+}
			
 
				 module.exports = cfg;
			
--- a/scripts/plaid.conf.js
+++ b/scripts/plaid.conf.js
@@ -1,5 +1,4 @@
 
				 const { isProd } = require('@gera2ld/plaid/util');
			
 
				-const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
			
 
				 
			
 
				 /**
			
 
				  * For each entry, `key` is the chunk name, `value` has following properties:
			
@@ -60,16 +59,11 @@ exports.optimization = {
 
				       ...splitVendor('tldjs'),
			
 
				     },
			
 
				   },
			
 
				-  minimizer: isProd && [
			
 
				-    /* 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'),
			
 
				-        require('cssnano'),
			
 
				-      ]),
			
 
				-    }),
			
 
				-  ],
			
 
				+};
			
 
				+exports.styleOptions = {
			
 
				+  /* Files in extensions aren't cached so there's no point in extracting separate css,
			
 
				+   * other than minifying, but the gain is negligible. P.S. Extracting+inlining back in html
			
 
				+   * doesn't keep the correct order of style elements which breaks appearance when
			
 
				+   * using style-ext-html-webpack-plugin or html-inline-css-webpack-plugin. */
			
 
				+  extract: false,
			
 
				 };
			
--- a/scripts/webpack.conf.js
+++ b/scripts/webpack.conf.js
@@ -1,7 +1,6 @@
 
				 const { modifyWebpackConfig, shallowMerge, defaultOptions } = require('@gera2ld/plaid');
			
 
				 const { isProd } = require('@gera2ld/plaid/util');
			
 
				 const webpack = require('webpack');
			
 
				-const HTMLInlineCSSWebpackPlugin = isProd && require('html-inline-css-webpack-plugin').default;
			
 
				 const TerserPlugin = isProd && require('terser-webpack-plugin');
			
 
				 const deepmerge = isProd && require('deepmerge');
			
 
				 const { ListBackgroundScriptsPlugin } = require('./manifest-helper');
			
@@ -118,21 +117,6 @@ module.exports = Promise.all([
 
				       footer: '}',
			
 
				       test: /^(?!injected|public).*\.js$/,
			
 
				     }));
			
 
				-    /* 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. */
			
 
				-    if (isProd) {
			
 
				-      config.plugins.push(new HTMLInlineCSSWebpackPlugin({
			
 
				-        replace: {
			
 
				-          target: '<body>',
			
 
				-          position: 'before',
			
 
				-        },
			
 
				-      }));
			
 
				-      config.plugins.find(p => (
			
 
				-        p.constructor.name === 'MiniCssExtractPlugin'
			
 
				-        && Object.assign(p.options, { ignoreOrder: true })
			
 
				-      ));
			
 
				-    }
			
 
				     config.plugins.push(new ListBackgroundScriptsPlugin({
			
 
				       minify: false, // keeping readable
			
 
				     }));