【webpack】webpack打包之坑 _ webpackChunkName:


一、webpackChunkName的作用:

简单了解:webpackChunkName 是为预加载的文件取别名,作用就是webpack在打包的时候,对异步引入的库代码(lodash)进行代码分割时(需要配置webpack的SplitChunkPlugin插件),为分割后的代码块取得名字

import异步加载的写法实现页面模块lazy loading懒加载(Vue中的路由异步加载):
Vue中运用import的懒加载语句以及webpack的魔法注释,在项目进行webpack打包的时候,对不同模块进行代码分割,在首屏加载时,用到哪个模块再加载哪个模块,实现懒加载进行页面的优化

/* webpackChunkName: "login" */
在这里插入图片描述

二、魔法注释中没有index

打包部署时,控制台不报错并且#app里面为空

三、魔法注释中名字不规范

webpack 的魔法注释 webpackChunkName 并不会影响打包 , 而是起的名字有问题 , 不规范导致的 ,
因为起的名字它好像是打包编译后会变成对应的文件名 , 而既然是文件名了 , 肯定就是不能够以 * 号进行命名滴 !文件或文件夹名以 * 命名 会报错提示你 :名称 * 作为文件或文件夹名无效。请选择其他名称

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Sun Peng

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值