web-dev-qa-db-ja.com

VueJSは、本番モードでビルドしても「開発モード」メッセージを表示します

VueJS2(2.2.0)を本番モードで実行する際に問題が発生します。 「あなたは開発モードでVueを実行しています。」」というメッセージが、本番モードでwebpackを使用してビルドした場合でも、常にコンソールに表示されます。 https:// vuejs.org/v2/guide/deployment.html webpackを本番モードで実行するのに十分であり、すべてが縮小されているため、webpackは本番モードで実行されていることを「認識」しているように見えますが、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

また、webpack(4.11.1)を実行する前に、手動でNODE_ENVを "production"に設定してみましたが、違いはありません...

ここで何が欠けていますか?

8
Yama

エイリアスvue/dist/vue.jsを設定すると、常に開発モードになっているファイルを使用していることになります。エイリアスをvue/dist/vue.min.jsに変更すると、本番モードになります。

ビルド環境に一致するようにVueのバージョンを設定できます。この例では、本番ビルドでprocess.env.NODE_ENVproductionに設定されていることを前提としているため、次のようにする必要があります。この例を使用するのは確かにそうだったことを確認してください。

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

参考のために このGithubの問題 を参照してください。

14
rb-
  • 本番モードの場合:npm run buildnpm start

  • 開発モードの場合:npm run dev

すでにnpm startを実行しているが、それでもRunning in production modeを取得している場合。

私の場合と同じように、"start": "nuxt start"の代わりに"start": "nuxt"を使用すると、機能しました

これは正しいpackage.jsonです:

  "scripts": {
    "dev": "nuxt",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate"
  },
0
HoangYell