Quickly solve the problem of source code after the vue project build is packaged

Browser by pressing F12and then turn on the console, click Source, click webpack://, click on the appropriate vue 文件, even found the vuecode turned out to be completely displayed, ah this. . . . Okay, it's a bit tricky, and it's not mentioned in the official document (maybe I am too dishonest).

In fact, this is for the convenience of front-end programmer in a formal environment for debugging, 默认是开启的in vuelearning the official website did not introduce too much, because the use is vue-clito package, so vue-clithere is a document presentation, specific view https: //cli.vuejs. org/zh/config/#productionsourcemap

There are two solutions:

• Method One: If you have a project vue.config.jsfile, you can configure the file, if not the venue and method II.

module.exports = {
    
    
  ...
  productionSourceMap: false // false 表示关闭
  ...
}

• Method 2: package.jsonincrease in vueproperty, configured in there, it must comply with JSONthe syntax

[Note] in vue-cli 3.0after vue.config.jsit becomes an optional configuration file, the default is not, but then, we can package.jsonbe configured, the configuration is as follows:

{
    
    
  ...
  "dependencies": {
    
    
    ...
  },
  "vue": {
    
    
    "productionSourceMap": false // false 表示关闭
  },
  ...
}

I really need to check more documents in the future: vue-cli configuration document

Personal blog: Roc's Blog