webpack 配置

Question

问题描述

webpack-dev-server 启动后html的后缀没了,难受

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
module.exports = {
    entry: {
        index: './src/index.js',
        about: './src/test.js'
    },
    output: {
        path: path.resolve('dist/static/'),
        //filename: '[name].js',
        filename: '[name].js',
        publicPath: 'static/'
    },
    plugins: [  //插进的引用, 压缩，分离美化
        new HtmlWebpackPlugin({  
            filename: process.cwd()+'/dist/index.html', 
            template: 'src/about.html',
            chunks: ['about', 'test']
        }),
        new HtmlWebpackPlugin({  
            filename: process.cwd()+'/dist/about.html', 
            template: 'src/index.html', 
            chunks: ['index']
        }),
        new CleanWebpackPlugin(['dist'], 
            {
                root: process.cwd(), 
                verbose: true, 
                dry:      false    
            }
        ) 
    ],
    stats: { children: false },
    // devServer: {
    //     contentBase: process.cwd()+'/dist',
    //     port: 4200
    // }
}

启动命令

webpack-dev-server --config ./config/webpack.base.js --port 4200  --content-base dist/

文件目录

.
├── config
│   └── webpack.base.js
├── package.json
├── package-lock.json
├── remove
│   └── dd.js
└── src
    ├── about.html
    ├── index.html
    ├── index.js
    ├── other.js
    └── test.js

运行效果
图片描述

问题描述

about (magic html for about.js) (webpack-dev-server)应该是about.html
里面的内容也是html就是没有.html的后缀

求帮助