五、package.json的介绍

package.json是一个json格式的NPM配置文件，定义了这个项目所需要的各种模块，以及项目的配置信息（比如名称、版本、许可证等元数据）。

npm install命令根据这个配置文件，自动下载所需的模块，将package.json中的模块安装到node_modules文件夹下，也就是配置项目所需的运行和开发环境。

 

{
  "name": "vueclidemo", //1、项目名称
  "version": "0.1.0", //2、版本号
  "private": true, //3、是否私有项目
  "scripts": { //4、执行脚本。用npm执行。
    "serve【这个名字是可以改变的】": "vue-cli-service serve", //执行npm run serve 运行开发环境
    "build": "vue-cli-service build", //执行npm run build 运行发布版本
    "lint": "vue-cli-service lint" //执行npm run lint 运行ESLint
  },
  "dependencies": {//5、（生产环境下）配置项依赖模块列表【该环境下的依赖包代码会打包到dist->js->chunk-vendors.56acd13b.js文件中】
    "core-js": "^3.6.5",
    "vue": "^2.6.11"
  },
  "devDependencies": {//6、（开发环境下）配置项依赖模块列表【该环境下的依赖包代码不会打包到dist中】
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "vue-template-compiler": "^2.6.11"
  },
  "eslintConfig": {//7、（JavaScript）代码检测工具配置项
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "babel-eslint"
    },
    "rules": {}
  },
  "browserslist": [//8、自动添加CSS3兼容性扩展，比如-webkit-
    "> 1%",
    "last 2 versions",
    "not dead"
  ]
}

一般在打包自己的项目给别人或者在上传自己项目的时候，要把node_modules文件夹删除。

可以通过以下命令，把被删除的依赖包node_modules重新下载回来。

npm install

可以在任意代码位置，添加以下代码块，即可禁止/开启eslint代码检测工具。

/*eslint-disable*/

/*eslint-enable*/