@s-ui/bundler 9.7.0 → 9.10.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.10.0",
   "description": "Config-free bundler for ES6 React apps.",
   "bin": {
     "sui-bundler": "./bin/sui-bundler.js"
@@ -21,7 +21,7 @@
   },
   "homepage": "https://github.com/SUI-Components/sui/tree/master/packages/sui-bundler#readme",
   "dependencies": {
-    "@babel/core": "7.17.2",
+    "@babel/core": "7.17.5",
     "@s-ui/helpers": "1",
     "@s-ui/sass-loader": "1",
     "address": "1.1.2",
@@ -32,23 +32,23 @@
     "commander": "8.3.0",
     "css-loader": "6.6.0",
     "css-minimizer-webpack-plugin": "3.4.1",
-    "esbuild": "0.14.21",
+    "esbuild": "0.14.23",
     "escape-string-regexp": "4.0.0",
     "fast-glob": "3.2.11",
     "find-free-ports": "3.0.0",
     "html-webpack-plugin": "5.5.0",
     "https-browserify": "1.0.0",
     "mini-css-extract-plugin": "2.5.3",
-    "postcss": "8.4.5",
+    "postcss": "8.4.6",
     "postcss-loader": "6.2.1",
     "process": "0.11.10",
     "rimraf": "3.0.2",
-    "sass": "1.49.7",
+    "sass": "1.49.8",
     "stream-http": "3.2.0",
     "strip-ansi": "6.0.1",
     "style-loader": "3.3.1",
     "url": "0.11.0",
-    "webpack": "5.69.0",
+    "webpack": "5.69.1",
     "webpack-dev-server": "4.7.4",
     "webpack-manifest-plugin": "4.1.1",
     "webpack-node-externals": "3.0.0"

package/registerServiceWorker.js

@@ -2,23 +2,23 @@
 
 'use strict'
 
-var noop = function() {}
+var noop = function () {}
 var SW_URL = '/service-worker.js'
 
 /* eslint-disable no-console */
-exports.register = function(options) {
+exports.register = function (options) {
   options = options || {}
   var first = options.first || noop
   var renovate = options.renovate || noop
 
   if ('serviceWorker' in navigator) {
-    window.addEventListener('load', function() {
+    window.addEventListener('load', function () {
       navigator.serviceWorker
         .register(SW_URL)
-        .then(function(registration) {
-          registration.onupdatefound = function() {
+        .then(function (registration) {
+          registration.onupdatefound = function () {
             var installingWorker = registration.installing
-            installingWorker.onstatechange = function() {
+            installingWorker.onstatechange = function () {
               if (installingWorker.state === 'installed') {
                 if (navigator.serviceWorker.controller) {
                   // At this point, the old content will have been purged and
@@ -36,16 +36,16 @@ exports.register = function(options) {
             }
           }
         })
-        .catch(function(error) {
+        .catch(function (error) {
           console.error('Error during service worker registration:', error)
         })
     })
   }
 }
 
-exports.unregister = function() {
+exports.unregister = function () {
   if ('serviceWorker' in navigator) {
-    navigator.serviceWorker.ready.then(function(registration) {
+    navigator.serviceWorker.ready.then(function (registration) {
       registration.unregister()
     })
   }

package/service-worker.js

@@ -41,7 +41,7 @@ function canConstructResponseFromBodyStream() {
  * @param {Object} response
  * @returns {Promise<Response>}
  */
-const copyResponse = async function(response) {
+const copyResponse = async function (response) {
   const clonedResponse = response.clone()
 
   const responseInit = {

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-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.terserMinify,
+    extractComments,
+    terserOptions: {
+      ecma: 5,
+      sourceMap: sourceMap !== 'none' && sourceMap !== false
+    }
+  })
+
+module.exports = ({extractComments, sourceMap}) =>
+  supportLegacyBrowsers
+    ? terserMinifier({extractComments, sourceMap})
+    : esbuildMinifier({sourceMap})

package/utils/WebpackDevServerUtils.js

@@ -273,7 +273,7 @@ function prepareProxy(proxy, appPublicFolder, servedPathname) {
       // Modern browsers include text/html into `accept` header when navigating.
       // However API calls like `fetch()` won’t generally accept text/html.
       // If this heuristic doesn’t work well for you, use `src/setupProxy.js`.
-      context: function(pathname, req) {
+      context: function (pathname, req) {
         return (
           req.method !== 'GET' ||
           (mayProxy(pathname) &&

package/utils/webpackHotDevClient.js

@@ -47,7 +47,7 @@ const connection = new WebSocket(
 // Unlike WebpackDevServer client, we won't try to reconnect
 // to avoid spamming the console. Disconnect usually happens
 // when developer stops the server.
-connection.onclose = function() {
+connection.onclose = function () {
   if (typeof console !== 'undefined' && typeof console.info === 'function') {
     console.info(
       'The development server has disconnected.\nRefresh the page if necessary.'
@@ -151,7 +151,7 @@ function handleAvailableHash(hash) {
 }
 
 // Handle messages from the server.
-connection.onmessage = function(e) {
+connection.onmessage = function (e) {
   const message = JSON.parse(e.data)
   switch (message.type) {
     case 'hash':
@@ -242,10 +242,10 @@ function tryApplyUpdates(onHotUpdateSuccess) {
   // // webpack 2 returns a Promise instead of invoking a callback
   if (result && result.then) {
     result.then(
-      function(updatedModules) {
+      function (updatedModules) {
         handleApplyUpdates(null, updatedModules)
       },
-      function(err) {
+      function (err) {
         handleApplyUpdates(err, null)
       }
     )

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},