首页 文章

指定webpack运行时应该在哪个文件中

提问于
浏览 次
0

我正在尝试以某种方式配置代码分割...

  • 不包括所有输出文件中的webpack运行时

  • 对于webpack运行时不需要额外的 common.chunks.js 文件

  • 允许我指定包含webpack运行时的输出文件 .

在我的具体示例中，我有一个 header.js 文件，需要在页面的其余部分加载之前运行 . 我想指定此文件中存在哪些模块，以及webpack运行时 .

我有一个 bundle.js 文件，这是我的应用程序的大部分代码 . 由于webpack运行时将在 header.js 中加载，因此我'd like to ensure it'不包含在 bundle.js 中

我的切入点看起来像这样

entry: {
    header: './src/js/doStuffInHeader.js', //<-- I need webpack in here
    bundle: './src/js/main.js'             //<-- not in here
},

webpack文档说，

Entry chunk条目块包含运行时和一堆模块 . 如果块包含模块0，则运行时执行它 . 如果没有，它等待包含模块0的块并执行它（每次存在具有模块0的块时） . 普通块普通块不包含运行时 . 它只包含一堆模块 . 结构取决于块加载算法 . I. e . 对于jsonp，模块包装在jsonp回调函数中 . 块还包含它实现的块ID列表 .

但是没有关于如何区分webpack配置中的普通块和条目块的任何说明 .

webpack

2 回答

  • 0

    您可以使用 CommonsChunkPlugin 指定包含webpack运行时代码的条目 . 例如，对于 app ， vendor 和 polyfill 条目，它可能如下所示：

    new webpack.optimize.CommonsChunkPlugin({
    filename: '[name].bundle.js',
    names: [ 'app', 'vendor', 'polyfill', 'webpack' ]
  });

    姓氏（此处为 webpack ）将成为包含webpack运行时的条目 .

    回复于
  • 0

    我相信你可以使用带有多个入口点的Commons Chunk插件来指定你的块 .

    var webpack = require("webpack");
module.exports = {
  entry: { a: "./a", b: "./b" },
  output: { filename: "[name].js" },
  plugins: [ new webpack.optimize.CommonsChunkPlugin("init.js") ]
}

    所以 init.js 是一个只有你的运行时的文件（即header.js）

    回复于

相关问题