来源:自学PHP网 时间:2020-09-16 17:26 作者:小飞侠 阅读:次
[导读] 详解html-webpack-plugin使用...
最近在react项目中初次用到了 为html文件中引入的外部资源如script、link动态添加每次compile后的hash,防止引用缓存的外部文件问题 可以生成创建html入口文件,比如单页面可以生成一个html文件入口,配置N个 1、安装 cnpm i webpack-plugin -D 2、在webpack.config.json中引用 const path = require('path') const htmlWebpackPlugin = require('html-webpack-plugin') //第一步 module.exports = { entry: path.join(__dirname, './src/main.js'), output: { path: path.join(__dirname, './dist'), filename: 'bundle.js', }, mode: 'development', devServer: { open: true, port: 8080, hot: true, contentBase: 'src' }, plugins: [ new htmlWebpackPlugin({ //第二步 template: path.join(__dirname, './src/index.html'), //指定生成模板的路径 filename: 'index.html' //指定生成页面的名称 }) ] } 3、html-webpack-plugin的作用 一、在内存中生成一个指定模板的文件,在访问时速度更快 总结 到此这篇关于详解html-webpack-plugin使用的文章就介绍到这了,更多相关html-webpack-plugin使用内容请搜索自学php网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持自学php网! |
自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习
京ICP备14009008号-1@版权所有www.zixuephp.com
网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com