0

我正在将一个 vuejs 项目从 webpack 3 升级到 webpack 4。一切似乎都在工作（我可以在开发模式下运行项目），但我无法让替换插件正常工作。

这里有两个主要文件在起作用：

  • webpack.prod.conf.js
  • 实用程序.js

我在网上查看了几个示例，但无法弄清楚如何适当地结合这些文件。我不明白如何替换ExtractTextPlugin.extract，因为似乎没有等价物。

这是 utils.js 中处理 extract-text-webpack-plugin 的主要函数：

// generate loader string to be used with extract text plugin
function generateLoaders (loader, loaderOptions) {
const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
if (loader) {
  loaders.push({
    loader: loader + '-loader',
    options: Object.assign({}, loaderOptions, {
      sourceMap: options.sourceMap
    })
  })
}

// Extract CSS when that option is specified
// (which is the case during production build)
if (options.extract) {
  return ExtractTextPlugin.extract({
    use: loaders,
    fallback: 'vue-style-loader'
  })
} else {
  return ['vue-style-loader'].concat(loaders)
}

在 webpack.prod.conf.js 中：

 new ExtractTextPlugin({
  filename: utils.assetsPath('css/[name].[contenthash].css'),
  // set the following option to `true` if you want to extract CSS from
  // codesplit chunks into this main css file as well.
  // This will result in *all* of your app's CSS being loaded upfront.
  allChunks: false,
})
4

0 回答 0