webpack.config.js配置
const path = require('path');const webpack = require('webpack');const { CleanWebpackPlugin } = require('clean-webpack-plugin');const HtmlWebpackPlugin = require('html-webpack-plugin');const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;module.exports = { entry: { 'index1': './src/index1.js', 'index2': './src/index2.js', 'index3': './src/index3.js' }, output: { filename: '[name].[contenthash].js', path: path.resolve(__dirname, 'dist') }, //use inline-source-map for development //devtool: 'inline-source-map', //use source-map for production //devtool: 'source-map', //source-map eval-source-map cheap-module-source-map cheap-module-eval-source-map devtool: 'eval-source-map', devServer: { contentBase: './dist' }, module: { rules: [ { test: /\.js$/, loader: 'babel-loader', include: [path.resolve(__dirname, 'src')], exclude: [path.resolve(__dirname, 'node_modules')] } ] }, plugins: [ new CleanWebpackPlugin(), new BundleAnalyzerPlugin({ openAnalyzer: false, analyzerMode: 'static', reportFilename: 'bundle-analyzer-report.html' }), new HtmlWebpackPlugin({ template: './src/index1.html', filename: 'index1.html', chunks: ['index1', 'mainfest', 'vendor', 'common'] }), new HtmlWebpackPlugin({ templete: './src/index2.html', filename: 'index2.html', chunks: ['index2', 'mainfest', 'vendor', 'common'] }), new HtmlWebpackPlugin({ templete: './src/index3.html', filename: 'index3.html', chunks: ['index3', 'mainfest', 'vendor', 'common'] }), new webpack.HashedModuleIdsPlugin() ], optimization: { runtimeChunk: { "name": "manifest" }, splitChunks: { cacheGroups: { default: false, vendors: false, vendor: { test: /[\\/]node_modules[\\/]/, chunks: 'initial', enforce: true, priority: 10, name: 'vendor' }, common: { chunks: 'all', minChunks: 2, name: 'common', enforce: true, priority: 5 } } } }}
.babelrc配置
{ "presets": [ [ "@babel/preset-env", { "modules": false } ] ], "plugins": [ "@babel/plugin-syntax-dynamic-import" ]}