The "development mode" is still prompted under the production mode.

problem description

, npm run build will still appear after adding vue: "vue/dist/vue.js" to webpack.config.js:

You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
See more tips at https://vuejs.org/guide/deployment.html

remove this sentence and prompt

[Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.

webpack.config.js Code

const resolve = require("path").resolve
const webpack = require("webpack")
const HtmlWebpackPlugin = require("html-webpack-plugin")
const url = require("url")
const publicPath = ""

module.exports = (options = {}) => ({
  entry: {
    vendor: "./src/vendor",
    index: "./src/main.js"
  },
  output: {
    path: resolve(__dirname, "dist"),
    filename: options.dev ? "[name].js" : "[name].js?[chunkhash]",
    chunkFilename: "[id].js?[chunkhash]",
    publicPath: options.dev ? "/assets/" : publicPath
  },
  module: {
    rules: [{
        test: /\.vue$/,
        use: ["vue-loader"]
      },
      {
        test: /\.js$/,
        use: ["babel-loader"],
        exclude: /node_modules/
      },
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader", "postcss-loader"]
      },
      {
        test: /\.(png|jpg|jpeg|gif|eot|ttf|woff|woff2|svg|svgz)(\?.+)?$/,
        use: [{
          loader: "url-loader",
          options: {
            limit: 10000
          }
        }]
      }
    ]
  },
  plugins: [
    new webpack.optimize.CommonsChunkPlugin({
      names: ["vendor", "manifest"]
    }),
    new HtmlWebpackPlugin({
      template: "src/index.html"
    })
  ],
  resolve: {
    alias: {
      "~": resolve(__dirname, "src"),
      vue: "vue/dist/vue.js",
    },
    extensions: [".js", ".vue", ".json", ".css"]
  },
  devServer: {
    host: "127.0.0.1",
    port: 8010,
    proxy: {
      "/api/": {
        target: "http://127.0.0.1:8080",
        changeOrigin: true,
        pathRewrite: {
          "^/api": ""
        }
      }
    },
    historyApiFallback: {
      index: url.parse(options.dev ? "/assets/" : publicPath).pathname
    }
  },
  devtool: options.dev ? "-sharpeval-source-map" : "-sharpsource-map"
})

solve

Jun.17,2021

there is a suggestion. First, you can use the old version of vue-cli to create a project. It will customize the environment configuration webpack.config file for you, such as base production dev

.

then you can define it in the configuration file: (I guess you are not using webpack4 yet)

new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify('production')
    })

if it is 4: configure mode

module.exports = {
  mode: 'production'
}
Menu