const webpack = require("webpack") const HtmlPlugin = require('html-webpack-plugin') const path = require('path') const {CleanWebpackPlugin} = require('clean-webpack-plugin') // const MiniCssExtractPlugin = require("mini-css-extract-plugin"); module.exports = { mode: 'development', devServer: { open: true, // port: 8080, host: '127.0.0.1', static: path.resolve(__dirname, './src/htmls') }, module: { rules: [ // TODO: 配置导出文件夹 // {test: /\.css$/, use: [MiniCssExtractPlugin.loader, 'css-loader']}, {test: /\.css$/, use: ['style-loader', 'css-loader']}, {test: /\.less$/, use: ['style-loader', 'css-loader', 'less-loader']}, {test: /\.jpg|png|gif$/, use: 'url-loader'}, ] }, entry: { // 新页面需添加新入口 index: './src/js/index.js', test: './src/js/test.js', }, output: { /** * With zero configuration, * clean-webpack-plugin will remove files inside the directory below */ path: path.resolve(__dirname, 'dist'), filename: 'js/[name].js', }, plugins: [ new CleanWebpackPlugin(), new webpack.ProvidePlugin({ process: 'process/browser', Buffer: ['buffer', 'Buffer'] }), // new MiniCssExtractPlugin({ // // linkType: "text/css", // filename: "css/[name].css" // }), // home页打包 new HtmlPlugin({ // chunks: ['index'], chunks: [], // 不注入js,在单个页面中手动引入各自的js template: './src/htmls/index.html', filename: './htmls/index.html' }), // test页打包 new HtmlPlugin({ // chunks: ['test'], chunks: [], // 不注入js,在单个页面中手动引入各自的js template: './src/htmls/test.html', filename: './htmls/test.html' }) // 新页面需添加新打包位置 ], }