update webpack and rollup configs

Author: dev-javascript

.npmignore

@@ -11,6 +11,9 @@ webpack*
 rollup*
 .babelrc.js
 
+#development
+/build
+
 #demo
 /example
 index.html

package-lock.json

@@ -18,13 +18,10 @@
     "watch": "npm-run-all --parallel watch:*",
     "watch:scss": "sass --watch themes/scss:themes style/scss:style --no-source-map",
     "watch:js": "cross-env BABEL_OUTPUT=umd INCLUDE_POLYFILLS=true webpack --config webpack.config.js --env=development --watch",
-    "build": "npm-run-all clean:* --parallel build:lib:* build:scss:*  & npm-run-all --parallel build:umd:*",
-    "build:umd:dev": "cross-env BABEL_OUTPUT=umd INCLUDE_POLYFILLS=true webpack --config webpack.config.js --env=development",
-    "build:umd:prod": "rollup -c",
-    "build:umd:prod-pf": "cross-env INCLUDE_POLYFILLS=true rollup -c",
+    "build": "npm-run-all clean:* --parallel build:lib:* build:scss:*  & npm run build:dist",
+    "build:dist": "rollup -c",
     "build:lib:cjs": "cross-env BABEL_OUTPUT=cjs babel src/ --out-dir lib/cjs/ --ignore **/__tests__,**/__mocks__,**/*.test.js,**/*.js.snap",
     "build:lib:esm": "babel src/ --out-dir lib/esm/ --ignore **/__tests__,**/__mocks__,**/*.test.js,**/*.js.snap",
-    "build:lib:esm-pf": "cross-env INCLUDE_POLYFILLS=true babel src/ --out-dir lib/esm-including-polyfills/ --ignore **/__tests__,**/__mocks__,**/*.test.js,**/*.js.snap",
     "build:scss:dev": "sass themes/scss:themes style/scss:style --no-source-map",
     "build:scss:pro": "sass themes/minified-scss:themes style/minified-scss:style --style compressed --no-source-map",
     "clean:lib": "rimraf lib",
@@ -49,8 +46,7 @@
     "@babel/preset-env": "^7.11.0",
     "@babel/preset-react": "^7.10.4",
     "@babel/runtime-corejs3": "^7.13.10",
-    "@rollup/plugin-commonjs": "^18.0.0",
-    "@rollup/plugin-node-resolve": "^11.2.1",
+    "@rollup/plugin-node-resolve": "^13.1.3",
     "babel-loader": "^8.1.0",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "cross-env": "^7.0.3",

package.json

@@ -1,11 +1,10 @@
 import {terser} from 'rollup-plugin-terser';
-import commonjs from '@rollup/plugin-commonjs';
+import pkg from './package.json';
 import nodeResolve from '@rollup/plugin-node-resolve';
-const requirePolyfills = process.env.INCLUDE_POLYFILLS;
-export default {
-  input: requirePolyfills ? 'lib/esm-including-polyfills/index.js' : 'lib/esm/index.js',
+const getConfig = (en) => ({
+  input: pkg.module,
   output: {
-    file: requirePolyfills ? 'dist/react-dyn-tabs.including-polyfills.umd.min.js' : 'dist/react-dyn-tabs.umd.min.js',
+    file: en === 'dev' ? 'dist/react-dyn-tabs.umd.js' : 'dist/react-dyn-tabs.umd.min.js',
     format: 'umd',
     name: 'useDynTabs',
     globals: {
@@ -15,8 +14,15 @@ export default {
     },
     sourcemap: true,
   },
-  plugins: [terser(), commonjs(), nodeResolve({preferBuiltins: false})],
+  plugins: (function () {
+    const _plugins = [nodeResolve({preferBuiltins: false})];
+    if (en === 'prod') {
+      _plugins.push(terser());
+    }
+    return _plugins;
+  })(),
   external: function (id) {
     return /prop-types$|react$|react-dom$|.test.js$|.js.snap$|.css$/g.test(id);
   },
-};
+});
+export default [getConfig('dev'), getConfig('prod')];

rollup.config.js

@@ -1,53 +1,53 @@
 const path = require('path');
 const pkg = require('./package.json');
 const libraryName = pkg.name;
-module.exports = env => {
-    const isProduction = env === 'production';
-    return {
-        entry: './src/index.js',
-        output: {
-            filename: isProduction ? 'react-dyn-tabs.umd.min.js' : 'react-dyn-tabs.umd.js',
-            path: path.resolve(__dirname, 'dist'),
-            library: libraryName,
-            libraryTarget: 'umd',
-            publicPath: '/dist/',
-            umdNamedDefine: true
+module.exports = (env) => {
+  const isProduction = env === 'production';
+  return {
+    entry: './src/index.js',
+    output: {
+      filename: isProduction ? 'react-dyn-tabs.umd.min.js' : 'react-dyn-tabs.umd.js',
+      path: path.resolve(__dirname, 'build'),
+      library: libraryName,
+      libraryTarget: 'umd',
+      publicPath: '/build/',
+      umdNamedDefine: true,
+    },
+    devtool: isProduction ? 'source-map' : 'inline-source-map',
+    mode: env,
+    module: {
+      rules: [
+        {
+          test: /\.m?js$/,
+          exclude: /(node_modules|bower_components)/,
+          use: {
+            loader: 'babel-loader',
+          },
         },
-        devtool: isProduction ? 'source-map' : 'inline-source-map',
-        mode: env,
-        module: {
-            rules: [
-                {
-                    test: /\.m?js$/,
-                    exclude: /(node_modules|bower_components)/,
-                    use: {
-                        loader: 'babel-loader'
-                    }
-                },
-                {
-                    test: /\.css$/i,
-                    use: ['style-loader', 'css-loader'],
-                }
-            ]
+        {
+          test: /\.css$/i,
+          use: ['style-loader', 'css-loader'],
         },
-        resolve: {
-            alias: {
-                'assets': path.resolve(__dirname, 'assets')
-            }
-        },
-        externals: {
-            react: {
-                commonjs: "react",
-                commonjs2: "react",
-                amd: "React",
-                root: "React"
-            },
-            "react-dom": {
-                commonjs: "react-dom",
-                commonjs2: "react-dom",
-                amd: "ReactDOM",
-                root: "ReactDOM"
-            }
-        }
-    };
-};
+      ],
+    },
+    resolve: {
+      alias: {
+        assets: path.resolve(__dirname, 'assets'),
+      },
+    },
+    externals: {
+      react: {
+        commonjs: 'react',
+        commonjs2: 'react',
+        amd: 'React',
+        root: 'React',
+      },
+      'react-dom': {
+        commonjs: 'react-dom',
+        commonjs2: 'react-dom',
+        amd: 'ReactDOM',
+        root: 'ReactDOM',
+      },
+    },
+  };
+};