webpack 2: 打包带html的项目

本文在上一篇的基础上，增加了生成html文件的功能。

webpack默认不能处理html文件，需要安装插件。

npm install html-webpack-plugin --save-dev


增加的配置项见：webpack.config.js

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
    mode: 'production',//模式：production/development
    entry: './src/index.js',//入口文件
    output: {
        filename: 'main.js',//打包后的文件名
        path: path.resolve(__dirname,'./dist'),//目标文件夹绝对路径
        clean: true //打包前先清理dist文件夹
    },
    plugins: [
        new HtmlWebpackPlugin({
			template: './public/index.html',//模板html文件
			filename: 'index.html',//生成的html文件名
			inject: 'body' //生成是script标签位置
        })
    ]
}

参考文档：https://webpack.docschina.org/plugins/html-webpack-plugin/



本文链接地址： webpack 2: 打包带html的项目
https://blog.qingfengju.com/index.asp?id=445

上一篇： webpack 1: webpack 的简单使用
下一篇： Internet Explorer 控件及 mshta.exe 的 渲染模式（IE版本）

分类：Web开发 查看次数：1400 发布时间：2021/11/29 22:06:02