From 3cd03d67e3157a9eaa429cea1ef4bbc515ba11ff Mon Sep 17 00:00:00 2001 From: Henrik Wenz Date: Wed, 2 Mar 2022 22:53:24 +0100 Subject: [PATCH] [breaking-change] Version 4 (#143) Co-authored-by: Andrew Nagy --- package.json | 6 -- src/preset.js | 81 ------------------------ src/utils/get-latest-n-vendor-version.js | 15 +++++ src/webpack-config.js | 26 ++++++-- 4 files changed, 34 insertions(+), 94 deletions(-) delete mode 100644 src/preset.js create mode 100644 src/utils/get-latest-n-vendor-version.js diff --git a/package.json b/package.json index 66ce66b1..332308dd 100644 --- a/package.json +++ b/package.json @@ -35,14 +35,8 @@ }, "dependencies": { "@babel/core": "7.15.0", - "@babel/plugin-proposal-class-properties": "7.14.5", - "@babel/plugin-proposal-object-rest-spread": "7.14.7", - "@babel/plugin-transform-destructuring": "7.14.7", - "@babel/plugin-transform-react-jsx": "7.14.9", - "@babel/plugin-transform-runtime": "7.15.0", "@babel/polyfill": "7.12.1", "@babel/preset-env": "7.15.0", - "@babel/preset-react": "7.14.5", "@babel/runtime": "7.14.8", "babel-loader": "8.2.2", "babel-plugin-transform-react-remove-prop-types": "0.4.24", diff --git a/src/preset.js b/src/preset.js deleted file mode 100644 index 0ff8e31f..00000000 --- a/src/preset.js +++ /dev/null @@ -1,81 +0,0 @@ -const browserslist = require('browserslist') - -module.exports = ({ vendor, vendorVersion }) => { - const env = process.env.BABEL_ENV || process.env.NODE_ENV - const isProduction = env === 'production' - const targets = {} - targets[vendor] = vendorVersion || latest(vendor) - return { - presets: [ - // Latest stable ECMAScript features - [require('@babel/preset-env').default, { - // `entry` transforms `@babel/polyfill` into individual requires for - // the targeted browsers. This is safer than `usage` which performs - // static code analysis to determine what's required. - // This is probably a fine default to help trim down bundles when - // end-users inevitably import '@babel/polyfill'. - useBuiltIns: 'entry', - corejs: { version: '3.15' }, - // Do not transform modules to CJS - modules: false, - // Restrict to current vendor - targets - }], - [ - require('@babel/preset-react').default, - { - // Adds component stack to warning messages - // Adds __self attribute to JSX which React will use for some warnings - development: !isProduction - } - ] - ], - plugins: [ - // Necessary to include regardless of the environment because - // in practice some other transforms (such as object-rest-spread) - // don't work without it: https://github.com/babel/babel/issues/7215 - require('@babel/plugin-transform-destructuring').default, - // class { handleClick = () => { } } - require('@babel/plugin-proposal-class-properties').default, - // The following two plugins use Object.assign directly, instead of Babel's - // extends helper. Note that this assumes `Object.assign` is available. - // { ...todo, completed: true } - [ - require('@babel/plugin-proposal-object-rest-spread').default, - { - useBuiltIns: true - } - ], - // Transforms JSX - [ - require('@babel/plugin-transform-react-jsx').default, - { - useBuiltIns: true - } - ], - // Polyfills the runtime needed for async/await and generators - [ - require('@babel/plugin-transform-runtime').default, - { - helpers: false, - regenerator: true - } - ], - // Remove PropTypes from production build - isProduction && [require.resolve('babel-plugin-transform-react-remove-prop-types'), { - removeImport: true - }] - ].filter(Boolean) - } -} - -/** - * Returns the latest - * vendor version - * @param {String} vendor - * @return {Number} version - */ -function latest (vendor) { - const { versions } = browserslist.data[vendor] - return versions[versions.length - 1] -} diff --git a/src/utils/get-latest-n-vendor-version.js b/src/utils/get-latest-n-vendor-version.js new file mode 100644 index 00000000..0411f19a --- /dev/null +++ b/src/utils/get-latest-n-vendor-version.js @@ -0,0 +1,15 @@ +const browserslist = require('browserslist') + +/** + * Returns last n + * vendor version + * @param {integer} n + * @param {string} vendor + * @return {Number} version + */ +function getLastNVendorVersion (n, vendor) { + const { released } = browserslist.data[vendor] + return released[released.length - n] +} + +module.exports = getLastNVendorVersion diff --git a/src/webpack-config.js b/src/webpack-config.js index bc023933..352be3f8 100644 --- a/src/webpack-config.js +++ b/src/webpack-config.js @@ -8,7 +8,7 @@ const ZipPlugin = require('zip-webpack-plugin') const WebextensionPlugin = require('webpack-webextension-plugin') const getExtensionInfo = require('./utils/get-extension-info') const getExtensionFileType = require('./utils/get-extension-file-type') -const createPreset = require('./preset') +const getLastNVendorVersion = require('./utils/get-latest-n-vendor-version') const WebpackBar = require('webpackbar') module.exports = function webpackConfig ({ @@ -92,13 +92,25 @@ module.exports = function webpackConfig ({ test: /\.(js|jsx|mjs)$/, exclude: /node_modules/, use: { - loader: require.resolve('babel-loader'), + loader: 'babel-loader', options: { - cacheDirectory: true, - ...createPreset({ - vendor, - vendorVersion - }) + cacheDirectory: false, + presets: [ + ['@babel/preset-env', { + // `entry` transforms `@babel/polyfill` into individual requires for + // the targeted browsers. This is safer than `usage` which performs + // static code analysis to determine what's required. + // This is probably a fine default to help trim down bundles when + // end-users inevitably import '@babel/polyfill'. + useBuiltIns: 'entry', + // Do not transform modules to CJS + modules: false, + // Restrict to vendor + targets: { + [vendor]: vendorVersion || getLastNVendorVersion(3, vendor) + } + }] + ] } } })