如何使用Webpack 2.7将Vue.js置于生产模式?

rqdpfwrv  于 2022-12-04  发布在  Webpack
关注(0)|答案(1)|浏览(137)

我有一个现有的代码库,其中Vue.js有性能问题。我还在浏览器控制台中看到以下通知:

所以我想一个简单解决办法就是将Vue置于生产模式。
the suggested link中,我尝试按照Webpack的说明进行操作。我们使用的是Webpack版本2.7(当前的稳定版本是4.20)。在说明中,它说在Webpack 3和更早的版本中,您需要使用DefinePlugin

var webpack = require('webpack')
module.exports = {
  // ...
  plugins: [
    // ...
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify('production')
    })
  ]
}

因此,在我的package.json中,我定义了一个构建脚本:

为了构建产品,我运行yarn run build,它运行一个build.js文件(paste here),该文件依次调用webpack.base.conf.jspaste here)和webpack.prod.conf.jspaste here)。
正如你在粘贴中看到的,我使用了文档中建议的DefinePlugin
我还发现了一个名为vue-loader.conf.jspaste here)的文件,并且可以肯定的是,我还在其中添加了DefinePlugin
我可以运行yarn run build,它结束时没有错误,但当通过Apache提供站点并打开浏览器时,它仍然显示我们处于开发模式的通知。
为了确保它实际上使用了webpack创建的文件,我完全删除了文件夹/public/webpack/,并检查了webinterface在没有丢失文件的情况下是否正确加载,然后再次构建,看看命令完成后是否正确加载。因此,它实际上使用了webpack过程构建的文件。但Vue实际上不是在生产模式下创建的。
我哪里做错了?

wb1gzix0

wb1gzix01#

这个问题可能是在你的'webpack.base.conf.js'中,正如我所怀疑的,谢谢你分享它,在搜索时,我发现了一个问题,解决了你在github here上的'生产未被检测'问题
该解决方案要求您在生产中将'vue$': 'vue/dist/vue'更改为'vue$': vue/dist/vue.min
你会发现原来的答案是:
@ozee31此别名**'vue $':'vue/dist/vue'导致问题,请在生产环境中使用vue/dist/vue.min**。

相关问题