搜尋

首頁  >  問答  >  主體

javascript - 請問如何設定生產環境的webpack 才可以關閉Vue Devtools。

專案就要上生產了 但是發現生產環境在chorme的調試模式下還是可以看到vue-devtools請問該如何配置我的webpack。
註:我的專案沒有用vue-cli就是單純的webpack vue-loader打包.以下是我的程式碼:

var webpack = require("webpack");
var path = require("path");

module.exports = {
  /**
   * devtool
   * 开发者工具 debug用 生产环境要取消
   */
  cache: false,
  debug: false,
  /**
   * webpack 基础配置
   */
  entry: __dirname + "/../app/main.js",  //入口文件
  output: {
    filename: "build.js",
    path: path.resolve(__dirname, "../dist"),
    publicPath: '/dist/'
  },

  /**
   * module
   */
  module: {
    loaders: [
      {
        test: /\.vue$/,
        loader: 'vue'
      },
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel',
      },
      {
        test: /\.css$/,
        loader: 'style-loader!css-loader',
      },
      {
        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
        loader: 'url',
        query: {
          limit: 6000,
          name: 'assets/[name]_[hash:8].[ext]'
        }
      }
    ]
  },
  vue: {
    loaders: {
      js: 'babel',
    }
  },
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.js'
    }
  },
  babel: {
    presets: ['es2015', 'stage-0'],
    plugins: ['transform-runtime']
  }
};
if (process.env.NODE_ENV === 'production') {
  module.exports.devtool = false;
  module.exports.plugins = [
    new webpack.DefinePlugin({
      "process.env": {
        NODE_ENV: JSON.stringify("production")
      }
    }),
    new webpack.optimize.UglifyJsPlugin({
      compress: {
        warnings: false
      }
    }),
    new webpack.optimize.OccurenceOrderPlugin()
  ];
} else {
  module.exports.devtool = '#source-map'
}
phpcn_u1582phpcn_u15822748 天前2080

全部回覆(1)我來回復

  • 曾经蜡笔没有小新

    曾经蜡笔没有小新2017-05-19 10:48:44

    自己解決了。

    const isDebug_mode = process.env.NODE_ENV !== 'production';
    Vue.config.debug = isDebug_mode;
    Vue.config.devtools = isDebug_mode;
    Vue.config.productionTip = isDebug_mode;

    回覆
    0
  • 取消回覆