webpack更新中-插件的使用(plugin)

webpack插件的使用

一. plugin

可以实现自动生成HTML入口文件和引用js文件的功能

(1) 安装

• npm install html-webpack-plugin -D
• -D: 在本地开发环境中安装

(2) plugin在webpack.config.js 中配置

const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
    entry: './src/index.js',
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname,'./dist'),
        clean: true
    },
    mode: 'none',
    
     //所有插件
    plugins: [
        //实例化
        new HtmlWebpackPlugin({//配置option选项
            template:'./index.html',//模板
            filename:'app.html',//输出文件的文件名
            inject: 'body'//生成标签的位置
        })
    ]
}