Webpack使用供應商塊中的node_modules而不明確說明它們

Question

所以代碼拆分是創建不同包的技術 - 所以app，vendor等...

我知道我在vendor包中想要什么，但只是按慣例...

什么

import x from 'name';
import 'name';

這些必須在vendor ，因為（我認為它們）顯然來自node_modules 。

但是，我只看到明確說明這一點的例子。

有沒有辦法使用慣例？

如果沒有，我可以構建一個插件來執行此操作（此插件可以進入package.json的依賴項部分）嗎？

Answer 1

你能做的是：

const pkg = require('./package.json');

並在您的配置中：

{
   entry: {
      vendor: Object.keys(pkg.dependencies) // use node_module dependencies
   },
   plugins: [
     new webpack.optimize.CommonsChunkPlugin({
        name: "vendor"
     })
   ]
}

編輯：似乎有一個更好的方法來做到這一點。 可以在CommonsChunkPlugin插件中使用minChunks屬性。 你可以在那里傳遞一個函數：

plugins: [
    new webpack.optimize.CommonsChunkPlugin({
        name: "vendor",
        minChunks: ({ resource }) => {
            return resource && resource.match(/\.js$/) && resource.indexOf('node_modules') >= 0;
        }
    })
]

通過這樣做，您不需要依賴package.json列表，webpack將只考慮項目中使用的依賴項。 整齊。