dpzvc-ui 1.0.0 → 1.1.0

package/webpack.dist.dev.config.js

@@ -1,44 +1,49 @@
-var path = require('path');
-var webpack = require('webpack');
-var merge = require('webpack-merge');
-var webpackBaseConfig = require('./webpack.base.config.js');
+/**
+ * webpack.dist.dev.config.js
+ * 开发环境打包库文件 (Webpack 5)
+ */
+
+const path = require('path');
+const webpack = require('webpack');
+const { merge } = require('webpack-merge');
+const webpackBaseConfig = require('./webpack.base.config.js');
 
 process.env.NODE_ENV = 'production';
 
 module.exports = merge(webpackBaseConfig, {
-    entry: {
-        main: './src/index.js'
-    },
-    output: {
-        path: path.resolve(__dirname, './dist'),
-        publicPath: '/dist/',
-        filename: 'dpzvc.js',
-        library: 'dpzvc',
-        libraryTarget: 'umd',
-        umdNamedDefine: true
-    },
-    externals: {
-        vue: {
-            root: 'Vue',
-            commonjs: 'vue',
-            commonjs2: 'vue',
-            amd: 'vue'
-        }
-    },
-    plugins: [
-        new webpack.LoaderOptionsPlugin({
-            // test: /\.xxx$/, // may apply this only for some modules
-            options: {
-                babel:{
-                    presets: ['es2015'],
-                    plugins: ['transform-runtime']
-                }
-            }
-        }),
-        new webpack.DefinePlugin({
-            'process.env': {
-                NODE_ENV: '"production"'
-            }
-        })
-    ]
-});
+  mode: 'production',
+
+  entry: {
+    main: path.resolve(__dirname, './src/index.js')
+  },
+
+  output: {
+    path: path.resolve(__dirname, './dist'),
+    publicPath: '/dist/',
+    filename: 'dpzvc.js',
+    library: 'dpzvc',
+    libraryTarget: 'umd',
+    umdNamedDefine: true,
+    clean: false, // webpack5 新增，每次构建清理旧文件
+  },
+
+  externals: {
+    vue: {
+      root: 'Vue',
+      commonjs: 'vue',
+      commonjs2: 'vue',
+      amd: 'vue'
+    }
+  },
+
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify('production')
+    })
+  ],
+
+  // Webpack 5 建议禁用多余 optimization，因为是库打包
+  optimization: {
+    minimize: false, // 开发库打包通常不压缩
+  },
+});

package/webpack.dist.prod.config.js

@@ -1,50 +1,58 @@
-var path = require('path');
-var webpack = require('webpack');
-var merge = require('webpack-merge');
-var webpackBaseConfig = require('./webpack.base.config.js');
+/**
+ * webpack.dist.prod.config.js
+ * 生产环境打包库文件 (Webpack 5)
+ */
+
+const path = require('path');
+const webpack = require('webpack');
+const TerserPlugin = require('terser-webpack-plugin');
+const { merge } = require('webpack-merge');
+const webpackBaseConfig = require('./webpack.base.config.js');
 
 process.env.NODE_ENV = 'production';
 
 module.exports = merge(webpackBaseConfig, {
-    entry: {
-        main: './src/index.js'
-    },
-    output: {
-        path: path.resolve(__dirname, './dist'),
-        publicPath: '/dist/',
-        filename: 'dpzvc.min.js',
-        library: 'dpzvc',
-        libraryTarget: 'umd',
-        umdNamedDefine: true
-    },
-    externals: {
-
-        vue: {
-            root: 'Vue',
-            commonjs: 'vue',
-            commonjs2: 'vue',
-            amd: 'vue'
-        }
-    },
-    plugins: [
-        new webpack.DefinePlugin({
-            'process.env.NODE_ENV': '"production"'
-        }),
-        new webpack.LoaderOptionsPlugin({
-            // test: /\.xxx$/, // may apply this only for some modules
-            options: {
-                babel:{
-                    presets: ['es2015','stage-0'],
-                    plugins: ['transform-runtime']
-                }
-            }
-        }),
-        new webpack.optimize.UglifyJsPlugin({
-            compress: {
-                warnings: false,
-                drop_debugger: true,
-                drop_console: true
-            }
-        })
-    ]
-});
+  mode: 'production',
+
+  entry: {
+    main: path.resolve(__dirname, './src/index.js')
+  },
+
+  output: {
+    path: path.resolve(__dirname, './dist'),
+    publicPath: '/dist/',
+    filename: 'dpzvc.min.js',
+    library: 'dpzvc',
+    libraryTarget: 'umd',
+    umdNamedDefine: true,
+    clean: false // webpack5 新增，每次构建清理旧文件
+  },
+
+  externals: {
+    vue: {
+      root: 'Vue',
+      commonjs: 'vue',
+      commonjs2: 'vue',
+      amd: 'vue'
+    }
+  },
+
+  optimization: {
+    minimize: true,
+    minimizer: [
+      new TerserPlugin({
+        terserOptions: {
+          compress: { drop_console: true, drop_debugger: true },
+          output: { comments: false },
+        },
+        extractComments: false, // 防止生成 LICENSE.txt
+      })
+    ],
+  },
+
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify('production')
+    })
+  ]
+});

package/webpack.prod.config.js

@@ -1,72 +1,43 @@
-/**
- * 本地预览
- */
+const path = require('path');
+const { merge } = require('webpack-merge');
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const TerserPlugin = require('terser-webpack-plugin');
+const baseConfig = require('./webpack.base.config.js');
 
-var path = require('path');
-var fs = require('fs');
-var webpack = require('webpack');
-// var ExtractTextPlugin = require('extract-text-webpack-plugin');
-var HtmlWebpackPlugin = require('html-webpack-plugin');
-var merge = require('webpack-merge');
-var webpackBaseConfig = require('./webpack.base.config.js');
-var ExtractTextPlugin = require('extract-text-webpack-plugin');
-var FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin');
-
-
-process.env.NODE_ENV = '"production"'
-module.exports = merge(webpackBaseConfig, {
-    // 入口
-    entry: {
-        main: './src/main',
-        vendors: ['vue', 'vue-router']
-    },
-    // 输出
-    output: {
-        path:path.join(__dirname, './dist-prod'),
-        publicPath: '',
-        filename: '[name].js',
-        chunkFilename: '[name].chunk.js'
-    },
-    resolve: {
-        alias: {
-            dpzvc: './src/index',
-            vue: 'vue/dist/vue.js'
-        }
-    },
-    plugins: [
-
-        new webpack.DefinePlugin({
-            'process.env.NODE_ENV': process.env.NODE_ENV,
-        }),
-        // new ExtractTextPlugin({ filename: '[name].css', disable: true, allChunks: true }),
-        new webpack.optimize.CommonsChunkPlugin({ name: 'vendors', filename: 'vendor.bundle.js' }),
-        new webpack.LoaderOptionsPlugin({
-            // test: /\.xxx$/, // may apply this only for some modules
-            options: {
-                babel:{
-                    presets: ['es2015','stage-0'],
-                    plugins: ['transform-runtime']
-                }
-            }
-        }),
-        new HtmlWebpackPlugin({
-            inject: true,
-            filename: '../dist-prod/index.html',
-            template: './src/template/index.ejs'
-        }),
-
-        new webpack.optimize.UglifyJsPlugin({
-            compress: {
-                warnings: false,
-                drop_debugger: true,
-                drop_console: true
-            },
-            output: { // 删除打包后的注释
-                comments: false
-            }
-        }),
-
-        new FriendlyErrorsPlugin()
-    ]
-});
+process.env.NODE_ENV = 'production';
 
+module.exports = merge(baseConfig, {
+  mode: 'production',
+  entry: {
+    main: './src/main.js',
+    vendors: ['vue', 'vue-router']
+  },
+  output: {
+    path: path.resolve(__dirname, 'dist-prod'),
+    filename: '[name].[contenthash].js',
+    chunkFilename: '[name].[contenthash].chunk.js',
+    publicPath: ''
+  },
+  optimization: {
+    minimize: true,
+    minimizer: [new TerserPlugin()],
+    splitChunks: {
+      chunks: 'all'
+    }
+  },
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify('production')
+    }),
+    new HtmlWebpackPlugin({
+      template: './src/template/index.ejs',
+      filename: 'index.html',
+      inject: true,
+      minify: {
+        removeComments: true,
+        collapseWhitespace: true
+      }
+    })
+  ]
+});