webpack.config.js

/* 通用配置 */ const path = require(‘path’) const HtmlWebpackPlugin = require(‘html-webpack-plugin’) const webpack = require(‘webpack’) const ExtractTextPlugin = require(“extract-text-webpack-plugin”) module.exports = { entry:{ index:path.join(__dirname,‘src/index.js’), login:path.join(__dirname,‘src/login.js’) }, output: { filename: ‘js/[name].bundle.js’, path: path.resolve(__dirname, ‘dist’) }, module:{ rules: [ // 解析vue文件 { test:/.vueKaTeX parse error: Expected 'EOF', got '}' at position 180: … ] }̲, // 使用ba…/, exclude: /(node_modules|bower_components)/, use: { loader: ‘babel-loader’, options: { presets: [‘env’] } } }, // 管理样式资源，使js文件能够引入css模块 // 抽取样式文件为单独的css文件 { test:/.cssKaTeX parse error: Expected 'EOF', got '}' at position 211: … }) }̲, { …/, use:[ ‘style-loader’, ‘css-loader’, ‘less-loader’ ] }, // 管理图片文件，使css文件能够对图片引用 { test:/.(png|svg|jpg|gif)KaTeX parse error: Expected 'EOF', got '}' at position 175: … ] }̲, // 管理字体…/, use:[ { loader:‘file-loader’, options:{ name:‘img/[name].[hash:8].[ext]’ } } ] } ] }, plugins: [ // new HtmlWebpackPlugin({ // title: ‘Production’ // }), // shimming配置，使jquery能够在所有模块中使用 new webpack.ProvidePlugin({ $:‘jquery’ }), // 将css样式文件从js 打包中抽取出来，形成名字叫styles.css的文件 new ExtractTextPlugin("[name].css"), new HtmlWebpackPlugin({ // 文件title，如果不使用模板，那么直接就会显示在生成的文件中 // 如果使用了模板，那么就要使用表达式<%=htmlWebpackPlugin.options.title%> title:‘后台主页’, //生成目标文件的名字 filename:‘index.html’, //可以指定生成目录 // filename:‘assets/index.html’ // 指定模板 template:’./src/assets/templates/index.html’, // 指定资源引入的script标签位置 inject:‘header’, // 加入icon图标 favicon:’./src/assets/icons/logo.net.ico’, // 压缩代码 // 具体选项见https://github.com/kangax/html-minifier#options-quick-reference minify:{ // 去除注释 removeComments:false, // 压缩HTML代码，变成一行 collapseWhitespace:false }, // 在html页面引入打包后的js和css资源的时候，加上hash码 // hash:true, cache:true, // 在生成html的过程中，如果出现错误，则显示在html页面上，默认为true showErrors:true, chunks:[ ‘index’ ] }), new HtmlWebpackPlugin({ filename:‘login.html’, title:‘欢迎您，请登录’, hash:false, template:’./src/assets/templates/login.html’, showErrors:true, chunks:[ ‘login’ ], // 指定资源引入的script标签位置 inject:‘header’, // 加入icon图标 favicon:’./src/assets/icons/logo.net.ico’, // 压缩代码 // 具体选项见https://github.com/kangax/html-minifier#options-quick-reference minify:{ // 去除注释 removeComments:false, // 压缩HTML代码，变成一行 collapseWhitespace:false }, }) ], }

https://www.bbsmax.com/A/RnJWLkgy5q/