自己闲的无聊搭建的一个项目,项目中vue-router使用()=>import方式来做路由懒加载,实际上并没有做到按需加载。
但是如果切换成require.ensure的方式却可以,这是babel的配置 ,有没有大佬帮忙看下这是什么原因导致的吗?
版本: "webpack": "^5.58.0", "vue-router": "^3.2.0",
简单的demo地址https://github.com/songjie55/...
自己闲的无聊搭建的一个项目,项目中vue-router使用()=>import方式来做路由懒加载,实际上并没有做到按需加载。
但是如果切换成require.ensure的方式却可以,这是babel的配置 ,有没有大佬帮忙看下这是什么原因导致的吗?
版本: "webpack": "^5.58.0", "vue-router": "^3.2.0",
简单的demo地址https://github.com/songjie55/...
13 回答12.6k 阅读
2 回答4.9k 阅读✓ 已解决
7 回答1.8k 阅读
9 回答1.6k 阅读✓ 已解决
3 回答2.1k 阅读✓ 已解决
8 回答2.1k 阅读
5 回答641 阅读
问题已解决,对比vue-cli脚手架中的配置,发现是tsconfig.json中的module写的是commonjs(指定生成代码的模板标准),所以路由中的懒加载方式需要用commonjs的require.ensure来实现,改成esnext(es6模块化规范)就可以使用Import来懒加载组件了,顺带提一句webpack5现在会自动给懒加载的文件分配chunkname就不需要手动自己去写,通常在开发环境下chunkname就是文件的路径,生产环境下就是hash了。