webpack require-ensure 异步加载问题

Question

刚刚弄了一下 webpack require-ensure 这个异步加载的方式，有点想不通，先贴下图

我不懂的是，这个css文件webpack是从哪里拿来的？本地吗？我感觉他还是从build那个js文件里边拿出来的，怎么想不通呢？假如我想加载一个js文件那么webpack从本地require进来，然后怎么做呢？还是push到build.js吗？ 大家有没有用过，麻烦跟弟弟说一下这个流程， 是在是搞不懂呀，还有另外如果多页面要用到这个异步加载的文件，在进入这个页面的时候，再进入其他页面的时候 它还要加载吗？但是其他页面要用的话，是肯定要写这个require 加载的.

Answer 1

你看到最终的css是内嵌的形式，那么，显然这个是style-loader的作用了，也就是把css放在js里了。而这里用了require.ensure()这个异步加载的语法，那么webpack会强制分出一个小chunk(也是一个js，放在dist/build目录里的，具体怎么命名是看output.chunkFilename参数)，然后在浏览器执行到你这段代码的时候再由webpack自行加载。