关于javascript:webpack基本配置二单页应用

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: './src/index.js',    output: {        filename: '[name].[contenthash].js',        path: path.resolve(__dirname, 'dist')    },    //use inline-source-map for development    devtool: 'inline-sorce-map',    //use source-map for production    //devtool: '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/index.html',            filename: 'index.html'        }),        new webpack.HashedModuleIdsPlugin()    ],    optimization: {        runtimeChunk: {            "name": "manifest"        },        splitChunks: {            chunks: 'all',            cacheGroups: {                common: {                    minChunks: 2,                    name: 'commons',                    chunks: 'async',                    priority: 10,                    reuseExistingChunk: true,                    enforce: true                }            }        }    }}

.babelrc配置

{    "presets": [        [            "@babel/preset-env",            {                "modules": false            }        ]    ],    "plugins": [        "@babel/plugin-syntax-dynamic-import"    ]}