webpack异步加载文件的方式
2021-03-07 00:29
标签：loader undle error console while fetch 就是 mod webp 1. import 2. require.ensure 3. bundle-loader 本质上对require.ensure的包装，需要在配置文件中配置，使用不够灵活，对ES6支持也不好，不推荐 webpack所有的异步加载模块方式，都是调用__webpack_require__.e方法，就是requireEnsure方法，使用JSONP来加载异步文件。 webpack异步加载文件的方式 标签：loader undle error console while fetch 就是 mod webp 原文地址：https://www.cnblogs.com/mengff/p/12892506.htmlimport(/* webpackPrefetch: true,webpackChunkName: "yourFileName",webpackPreload: true */ ‘LoginModal‘)
import ( /* webpackChunkName: "yourFileName" */ filePath);
import ( /* webpackChunkName: "lodash" */ ‘lodash‘).then(({
default: _
}) => {
console.log(_)
}).catch(error => ‘An error occurred while loading the component‘);
//将A单独打包
require.ensure([],()=>{
require(A)
},"bundleA")；
//将A,B打包到一起，而且从主文件束中拆分出来。但只有 b.js 的内容被执行。a.js //的内容仅仅是可被使用，但并没有被输出。
//想去执行 a.js，我们需要异步地引用它，如 require(‘./a.js’)，让它的 JavaScritp 被执行。
require.ensure([A],()=>{
require(B)
},bundleAB)