我试图通过有两个指向同一个文件的入口点从单个代码库构建两个单独的包。不同之处在于名称中带有 .mobile 的必需文件不应包含在桌面包中(noops),反之亦然。
这很容易通过运行 webpack 两次并使用基于两个单独配置的 null-loader 来完成,但我想知道出于性能原因在单次运行中是否有可能。
有任何想法吗?

最佳答案

好吧,我迟到了一年多,但如果你仍然有兴趣知道这是如何完成的,这是我实现这一目标的方式:

{

  entry: {

    'desktop/index': './js/desktop/index.js',
    'desktop/post': './js/desktop/post.js',
    'desktop/vendor': [
      'jquery'
    ],

    'mobile/index': './js/mobile/index.js',
    'mobile/vendor': [
      'jquery'
    ]

  },

  output: {
    filename: '[name].[chunkhash].js',
    chunkFilename: 'chunk.[chunkhash].js',
    path: path.resolve(__dirname, 'dist')
  },

  plugins: [
    new webpack.optimize.CommonsChunkPlugin({
      names: ['desktop/common', 'desktop/vendor'],
      chunks: ['desktop/common', 'desktop/index', 'desktop/post'],
      minChunks: 2
    }),
    new webpack.optimize.CommonsChunkPlugin({
      names: ['mobile/common', 'mobile/vendor'],
      chunks: ['mobile/common', 'mobile/index'],
      minChunks: 2
    })
  ]

};

made a repo 你可以克隆来看看这个工作。请注意,目前,您必须手动更改 .html 文件中 脚本 标记的 src

关于javascript - 使用 Webpack 为移动和桌面单独捆绑,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/33440643/

10-11 12:41