Webpack compiling vue with NODE_ENV=production still results in dev warning

Question

I run an extremely simple web pack config below against a vue.js frontend. The bundle.js is compiled but still produces the 'You are running Vue in development mode' warning. I have followed the advice specified here but it doesn't change anything.

Any ideas what's going on please?

This is my webpack.config.js:

var webpack = require('webpack')

module.exports = {
entry: './www/src/js/main.js',
output: {
  path: "./www/static/js",
  filename: "bundle.js"
},
plugins: [
  new webpack.DefinePlugin({
    'process.env': {
      NODE_ENV: '"production"'
  }
}),
new webpack.optimize.UglifyJsPlugin({
    compress: {
      warnings: false
    }
})
],
module: {
  loaders: [
    {
      test: /\.js$/,
      loader: 'babel',
      exclude: /node_modules/
    },
    {
      test: /\.vue$/,
      loader: 'vue'
    }
  ]
},
vue: {
  loaders: {
    js: 'babel'
  }
}
}

Answer 1

Which version of Vue you are using? If it is Vue 2.1.0 or higher, check this answer:

Probably you are using the vue.js file instead of the vue.common.js file.

For direct use, you should use the vue.js for dev and vue.min.js for production. Both of these files has the environment hardcoded as 'development' and 'production', respectively.

For the WebPack, you should use the vue.common.js file instead, because it will handle the process.env.NODE_ENV variable. For this, add an alias attribute to your webpack file:

module.exports = {
  ...
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.common.js'
    }
  },
  ...
}

Answer 2

Issue was i was doing:

import Vue from 'vue/dist/vue.js'

Instead of:

import Vue from 'vue/dist/vue.common.js'

Difference being the first is hardcoded to dev which is why the warnings etc don't get stripped out.

Answer 3

If you are using OSX(Unix) || Linux

export NODE_ENV=production

Windows users should set the NODE_ENV using

set NODE_ENV=production

Are you sure you set your NODE_ENV var? Check for it.

echo $NODE_ENV