即使在生产模式下构建，VueJS 也会显示 "development mode" 消息

Question

我在生产模式下将 VueJS2 (2.2.0) 升级到运行时遇到问题。消息 "You are running Vue in development mode." 始终显示在控制台中，即使我在生产模式下使用 webpack 构建它也是如此。根据 https://vuejs.org/v2/guide/deployment.html 在生产模式下运行 webpack 应该足够了，而且一切都在缩小，所以 webpack 似乎 'know' 它在生产模式下运行ning，但是 vueJs 不配合。

我的 webpack 配置如下所示：

let webpack = require('webpack');
let path = require('path');

module.exports = {
  entry: {
    app: './src/app.js',
      vendor: ['vue', 'axios']
    },
  output: {
    path: path.resolve(__dirname, 'public/js'),
    filename: "[name].js",
    publicPath: './public',
  },
  optimization: {
    splitChunks: {
      cacheGroups: {
        vendor: {
          chunks: 'initial',
          name: 'vendor',
          test: /[\/]node_modules[\/]/,
        }
      }
    }
  },
  resolve: {
    alias: {
      vue: 'vue/dist/vue.js'
    }
  }
};

为了构建用于生产的缩小文件，我运行:

webpack --mode=production --hide-modules

我也尝试在运行ning webpack (4.11.1) 之前手动将 NODE_ENV 设置为 "production"，但没有区别...

我在这里错过了什么？

Answer 1

当您设置别名 vue/dist/vue.js 时，您使用的是始终处于开发模式的文件。将您的别名更改为 vue/dist/vue.min.js，您将进入生产模式。

您可以设置您的 Vue 版本以匹配您的构建环境。此示例假设生产构建的 process.env.NODE_ENV 设置为 production，因此您需要确保确实如此才能使用此示例。

...
resolve: {
  alias: {
    vue: process.env.NODE_ENV == 'production' ? 'vue/dist/vue.min.js' : 'vue/dist/vue.js'
  }
}

参考this Github issue。

即使在生产模式下构建，VueJS 也会显示 "development mode" 消息

VueJS shows "development mode" message even with on build in production-mode

webpack

vue.js

vuejs2

webpack-4