@s-ui/bundler 9.7.0 → 9.7.1-beta.0

package/README.md

@@ -163,6 +163,7 @@ This tool works with zero configuration out the box but you could use some confi
 {
   "config": {
     "sui-bundler": {
+      "supportLegacyBrowsers": false, // default
       "onlyHash": "true",
       "env": ["APP_NAME", ["USER", "DEFAULT_VALUE"]],
       "vendor": ["react", "react-dom"],
@@ -172,13 +173,6 @@ This tool works with zero configuration out the box but you could use some confi
         "react": "preact"
       },
       "offline": true,
-      "targets": {
-        "chrome": "41",
-        "ie": "11",
-        "safari": "8",
-        "firefox": "60",
-        "ios": "8"
-      },
       "sourcemaps": {
         "dev": "cheap-module-eval-source-map",
         "prod": "hidden-source-map"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@s-ui/bundler",
-  "version": "9.7.0",
+  "version": "9.7.1-beta.0",
   "description": "Config-free bundler for ES6 React apps.",
   "bin": {
     "sui-bundler": "./bin/sui-bundler.js"
@@ -25,7 +25,6 @@
     "@s-ui/helpers": "1",
     "@s-ui/sass-loader": "1",
     "address": "1.1.2",
-    "autoprefixer": "10.4.2",
     "babel-loader": "8.2.3",
     "babel-preset-sui": "3",
     "buffer": "6.0.3",
@@ -39,8 +38,7 @@
     "html-webpack-plugin": "5.5.0",
     "https-browserify": "1.0.0",
     "mini-css-extract-plugin": "2.5.3",
-    "postcss": "8.4.5",
-    "postcss-loader": "6.2.1",
+    "@parcel/css": "1.3.1",
     "process": "0.11.10",
     "rimraf": "3.0.2",
     "sass": "1.49.7",

package/shared/config.js

@@ -4,8 +4,13 @@ const {
 } = require(`${process.cwd()}/package.json`)
 
 const {'sui-bundler': config = {}} = packageJsonConfig
-const {extractComments, sourcemaps} = config
+const {
+  extractComments = false,
+  sourcemaps,
+  supportLegacyBrowsers = false
+} = config
 
 exports.config = config
-exports.extractComments = extractComments || false
+exports.supportLegacyBrowsers = supportLegacyBrowsers
+exports.extractComments = extractComments
 exports.sourceMap = (sourcemaps && sourcemaps.prod) || false

package/shared/minify-css.js

@@ -2,13 +2,9 @@ const CssMinimizerPlugin = require('css-minimizer-webpack-plugin')
 
 const createCssMinimizerPlugin = () =>
   new CssMinimizerPlugin({
+    minify: CssMinimizerPlugin.parcelCssMinify,
     minimizerOptions: {
-      preset: [
-        'default',
-        {
-          discardComments: {removeAll: true}
-        }
-      ]
+      targets: {ie: 11}
     }
   })
 

package/shared/minify-js.js

@@ -1,6 +1,8 @@
 const TerserPlugin = require('terser-webpack-plugin')
 
-module.exports = ({extractComments, sourceMap}) =>
+const {supportLegacyBrowsers} = require('./config.js')
+
+const esbuildMinifier = ({sourceMap}) =>
   new TerserPlugin({
     minify: TerserPlugin.esbuildMinify,
     terserOptions: {
@@ -8,3 +10,18 @@ module.exports = ({extractComments, sourceMap}) =>
       sourcemap: sourceMap !== 'none' && sourceMap !== false
     }
   })
+
+const terserMinifier = ({extractComments, sourceMap}) =>
+  new TerserPlugin({
+    minify: TerserPlugin.esbuildMinify,
+    extractComments,
+    terserOptions: {
+      ecma: 5,
+      sourcemap: sourceMap !== 'none' && sourceMap !== false
+    }
+  })
+
+module.exports = ({extractComments, sourceMap}) =>
+  supportLegacyBrowsers
+    ? terserMinifier({extractComments, sourceMap})
+    : esbuildMinifier({sourceMap})

package/webpack.config.dev.js

@@ -106,18 +106,6 @@ const webpackConfig = {
             }
           })),
           require.resolve('css-loader'),
-          {
-            loader: require.resolve('postcss-loader'),
-            options: {
-              postcssOptions: {
-                plugins: [
-                  require('autoprefixer')({
-                    overrideBrowserslist: config.targets
-                  })
-                ]
-              }
-            }
-          },
           require.resolve('@s-ui/sass-loader')
         ])
       },

package/webpack.config.prod.js

@@ -17,7 +17,11 @@ const {
   config
 } = require('./shared/index.js')
 const {aliasFromConfig} = require('./shared/resolve-alias.js')
-const {extractComments, sourceMap} = require('./shared/config.js')
+const {
+  extractComments,
+  sourceMap,
+  supportLegacyBrowsers
+} = require('./shared/config.js')
 const {resolveLoader} = require('./shared/resolve-loader.js')
 const babelRules = require('./shared/module-rules-babel.js')
 const definePlugin = require('./shared/define.js')
@@ -35,13 +39,15 @@ const cssFileName = config.onlyHash
   ? '[contenthash:8].css'
   : '[name].[contenthash:8].css'
 
+const target = supportLegacyBrowsers ? ['web', 'es5'] : 'web'
+
 /** @typedef {import('webpack').Configuration} WebpackConfig */
 
 /** @type {WebpackConfig} */
 const webpackConfig = {
   devtool: sourceMap,
   mode: 'production',
-  target: ['web', 'es5'],
+  target,
   context: path.resolve(process.cwd(), 'src'),
   resolve: {
     alias: {...aliasFromConfig},
@@ -117,18 +123,6 @@ const webpackConfig = {
               manifestURL: config['externals-manifest']
             }
           })),
-          {
-            loader: require.resolve('postcss-loader'),
-            options: {
-              postcssOptions: {
-                plugins: [
-                  require('autoprefixer')({
-                    overrideBrowserslist: config.targets
-                  })
-                ]
-              }
-            }
-          },
           require.resolve('@s-ui/sass-loader')
         ])
       },