手动地对index.html进行文件管理,比如导入bundle,特别是有多个bundle时,就比较麻烦了。如果bundle的名称是hash的,就更加麻烦了。所以有必要使用工具来管理输出。
一. 如何有多个entry以及多个output file
const path = require('path'); const config = { // 多个entry entry: { app: './src/index.js', print: './src/print.js' }, output: { // 这里的[name]就是对应于entry中的key
// 这里的[chunkhash]就是使得输出的文件名称中带有hash filename: '[name].[chunkhash].bundle.js', path: path.resolve(__dirname, 'dist') }, plugins: [ // new BundleAnalyzerPlugin() ] }; module.exports = config;
输出:
这里可以看到,输出的bundle文件都是带有hash的,那么当我们需要在index.html引用这些文件时,每build一次都需要更新index.html,这是比较麻烦的。可以使用HtmlWebpackPlugin来解决这个问题。
原文地址:https://www.cnblogs.com/JasonWang-code/p/14132621.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。