diff --git a/.babelrc b/.babelrc deleted file mode 100644 index 01933494c267ee9640051612da151551908ec051..0000000000000000000000000000000000000000 --- a/.babelrc +++ /dev/null @@ -1,10 +0,0 @@ -{ - "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": [ - "@babel/plugin-transform-runtime", - "transform-react-remove-prop-types", - ["lodash", { "id": [ - "lodash", - ]} - ]], -} diff --git a/babel.config.js b/babel.config.js new file mode 100644 index 0000000000000000000000000000000000000000..52e5023b97e10f51eb74d6445a66b5852d220429 --- /dev/null +++ b/babel.config.js @@ -0,0 +1,88 @@ +/* + * babel.config.js used to support a UMD built version of Mirador that is + * compatible with IE11 and Edge. + */ + +// eslint-disable-next-line func-names +module.exports = function (api) { + const isDevelopmentEnv = api.env('development'); + const isProductionEnv = api.env('production'); + const isTestEnv = api.env('test'); + + const presets = [ + isTestEnv && [ + '@babel/preset-env', + { + modules: 'commonjs', + targets: { + node: 'current', + }, + }, + '@babel/preset-react', + ], + (isProductionEnv || isDevelopmentEnv) && [ + '@babel/preset-env', + { + corejs: 3, + exclude: ['transform-typeof-symbol'], + forceAllTransforms: true, + modules: false, + useBuiltIns: 'entry', + }, + ], + [ + '@babel/preset-react', + { + development: isDevelopmentEnv || isTestEnv, + useBuiltIns: true, + }, + ], + ].filter(Boolean); + + const plugins = [ + 'babel-plugin-macros', + '@babel/plugin-transform-destructuring', + [ + '@babel/plugin-proposal-class-properties', + { + loose: true, + }, + ], + [ + '@babel/plugin-proposal-object-rest-spread', + { + useBuiltIns: true, + }, + ], + [ + '@babel/plugin-transform-runtime', + { + corejs: false, + helpers: false, // Needed to support IE/Edge + regenerator: true, + }, + ], + [ + '@babel/plugin-transform-regenerator', + { + async: false, + }, + ], + ['transform-react-remove-prop-types', + { + ignoreFilenames: ['node_modules'], + removeImport: true, + }, + ], + ['lodash', { + id: [ + 'lodash', + ], + }, + ]]; + + return { + plugins, + presets, + }; +}; diff --git a/bundlewatch.config.json b/bundlewatch.config.json index 07cc6de8b834686a1d3dc0fd1da35f0c32209fed..cf0813d3d21608ef3aba4c0114ff20c7df646f4e 100644 --- a/bundlewatch.config.json +++ b/bundlewatch.config.json @@ -2,7 +2,7 @@ "files": [ { "path": "dist/mirador.min.js", - "maxSize": "430 KB" + "maxSize": "460 KB" } ] } diff --git a/package.json b/package.json index 411fba5ff454e32f4dc00559fad8cb3b4cd59473..4ebafe085ca1b04711b927ecd7c7d8f31b95461c 100644 --- a/package.json +++ b/package.json @@ -71,18 +71,23 @@ "devDependencies": { "@babel/cli": "^7.5.0", "@babel/core": "^7.5.0", - "@babel/plugin-transform-runtime": "^7.5.0", + "@babel/plugin-proposal-class-properties": "^7.7.4", + "@babel/plugin-proposal-object-rest-spread": "^7.7.4", + "@babel/plugin-transform-regenerator": "^7.7.5", + "@babel/plugin-transform-runtime": "^7.7.6", "@babel/preset-env": "^7.5.0", "@babel/preset-react": "^7.0.0", "babel-eslint": "10.0.2", "babel-jest": "^24.8.0", "babel-loader": "^8.0.6", "babel-plugin-lodash": "^3.3.4", + "babel-plugin-macros": "^2.8.0", "babel-plugin-transform-react-remove-prop-types": "^0.4.24", "bundlewatch": "^0.2.5", "chalk": "^2.4.2", "codecov": "^3.5.0", "concurrently": "^4.1.1", + "core-js": "^3.4.8", "css-loader": "^3.0.0", "enzyme": "^3.10.0", "enzyme-adapter-react-16": "^1.14.0", @@ -110,6 +115,8 @@ "style-loader": "^0.23.1", "supertest": "^4.0.2", "terser-webpack-plugin": "^1.3.0", + "unfetch": "^4.1.0", + "url-polyfill": "^1.1.7", "webpack": "^4.35.3", "webpack-cli": "^3.3.5" }, diff --git a/src/polyfills.js b/src/polyfills.js new file mode 100644 index 0000000000000000000000000000000000000000..01c9cc202ee1494b9dee0a7ebac6fb230b983241 --- /dev/null +++ b/src/polyfills.js @@ -0,0 +1,9 @@ +/** + * Polyfill file used to build Webpack UMD build. These polyfills are needed to + * support both IE and Edge. If you are using Mirador ES imports these will not + * get bundled up. + */ + +import 'core-js/stable'; // eslint-disable-line import/no-extraneous-dependencies +import 'url-polyfill/url-polyfill'; // eslint-disable-line import/no-extraneous-dependencies +import 'unfetch/polyfill'; // eslint-disable-line import/no-extraneous-dependencies diff --git a/webpack.config.js b/webpack.config.js index e252fd9147b931fce85705c86f839d219f0b51a1..760b6b39dc96b7c42c238c13ec4146c0ad479676 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -4,7 +4,7 @@ const TerserPlugin = require('terser-webpack-plugin'); const paths = require('./config/paths'); const babelLoaderConfig = { - include: paths.appSrc, // CRL + include: paths.appPath, // CRL loader: require.resolve('babel-loader'), options: { // Save disk space when time isn't as important @@ -14,7 +14,6 @@ const babelLoaderConfig = { }, test: /\.(js|mjs|jsx)$/, }; - const baseConfig = [ { entry: './src/index-core.js', @@ -31,7 +30,7 @@ const baseConfig = [ }, }, { - entry: './src/index.js', + entry: ['./src/polyfills.js', './src/index.js'], module: { rules: [ babelLoaderConfig,