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

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

2022-08-06 08:01:00 【Rick_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

边栏推荐

猜你喜欢

随机推荐