我想知道是否可以告诉webpack创建一个仅包含一个文件的块。
在Vue.js中,我有main.js
文件,该文件具有挂载和呈现应用程序的功能(main.js导入了App组件,然后在App中导入了多个组件)。
我创建了另一个文件-bootstrapper.js
,该文件导入main.js,进行一些引导,最后从main.js
调用函数以渲染应用程序。
Webpack入口点设置为bootstrapper.js
文件。
通过这种设置(默认splitChunks
设置),webpack会生成vendors
块和bootstrapper
块(包含所有应用程序代码的引导程序)。 bootstrapper.js
将随每次部署而变化,因此我猜想引导程序中即使更改了1行,也会迫使客户端重新加载包含应用程序代码的整个块(即使该代码根本没有变化)。
bootstrapper.js
import { something } from './main.js'
//do some bootstrapping
something.bootstrap();
main.js
import { App } from './App.vue'
//more Vue lib imports here
...
function bootstrap() { new Vue()... //render app }
App.vue
<script>
import { Long, List, Of, Very, Important, Components } from './components'
...
</script>
所以问题是:我可以以某种方式告诉webpack创建两个单独的块-一个用于bootstrapper.js
,然后另一个用于main.js
及其依赖项吗?它们都应该在启动时加载,但是仅更改bootstrapper.js
时,此设置不会强制重新加载缓存。