当前位置:网站首页>5. 自动引入打包资源 plugins的使用

5. 自动引入打包资源 plugins的使用

2022-08-06 08:01:20Rick_Jci

html-webpack-plugin

1. 作用

  • 基于模板html文件生成一个html文件,自动引入webpack打包生成的js文件

2. 安装

npm install html-webpack-plugin -D

3. 引入和配置

// webpack.config.js
// 引入
const HtmlWebpackPlugin = require('html-webpack-plugin')
// 使用
new HtmlWebpackPlugin({
    
  template: path.join(__dirname, './index.html'), // 模板文件目录(相对路径也可以)
  filename: 'webpack.html', // 生成的html文件的名字
  inject: 'body' // webpack打包生成的js文件插入的位置(默认插入head标签)
})

4. 重新打包webpack

npx webpack
原网站

版权声明
本文为[Rick_Jci]所创,转载请带上原文链接,感谢
https://blog.csdn.net/qq_37905131/article/details/126165987

随机推荐