三、webpack打包怎么指定index.html为网页模板
打包后,把打包后的文件塞到html里面,并把结果放到webpack打包输出后的文件夹下面怎么指定src下的html文件1.安装webpack的html插件npm install html-webpack-plugin -D详情见1与2注释// webpack 是node写出来的node的写法let path = require('path');// console.log(pat...
·
打包后,把打包后的文件塞到html里面,并把结果放到webpack打包输出后的文件夹下面
怎么指定src下的html文件
1.安装webpack的html插件
npm install html-webpack-plugin -D
详情见1与2注释
// webpack 是node写出来的 node的写法
let path = require('path');
// console.log(path.resolve('dist'))
let HtmlWebpackPlugin = require('html-webpack-plugin'); //----1----在这里引入模块
module.exports = {
devServer: { //开发服务器的配置
port: 3000, //端口
progress: true, //打包进度条
contentBase: './dist', //以这个目录作为静态服务
open: true, //打包完成自动打开浏览器
compress: false //启用压缩
},
mode: 'development', //模式 默认两种 生产:production 开发:development
entry: './src/index.js', //入口
output: {
filename: 'bundle.js', //打包后的文件名称
path: path.resolve(__dirname, 'dist'), //路径必须是一个绝对路径,需要引入node的自带模块
},
plugins: [ //数组 放着所有的webpack插件
new HtmlWebpackPlugin({ //----2----在这里配置使用模块
template: './src/index.html', //需要放打包文件的html模板路径
filename: 'index.html' //打包完成后的这个模板叫什么名字
})
]
}
更多推荐
已为社区贡献3条内容
所有评论(0)