Package.json文件了解

package.json文件,定义了这个项目所需要的各种模块,以及项目的配置信息(比如名称、版本、许可证等元数据)。

前端项目日渐复杂,各种构建工具的使用,所以什么不会学什么,慢慢的什么就都会了
膜拜阮大神
官网package.json

概述

每个项目的根目录下面,一般都有一个package.json文件,定义了这个项目所需要的各种模块,以及项目的配置信息(比如名称、版本、许可证等元数据)。npm install命令根据这个配置文件,自动下载所需的模块,也就是配置项目所需的运行和开发环境。
下面是一个最简单的package.json文件,只定义两项元数据:项目名称和项目版本

1
2
3
4
{
"name" : "xxx",
"version" : "0.0.0",
}

上面代码说明,package.json文件内部就是一个JSON对象,该对象的每一个成员就是当前项目的一项设置。比如name就是项目名称,version是版本(遵守“大版本.次要版本.小版本”的格式)。
下面是一个更完整的package.json文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
{
"name": "myvue3",
"version": "0.1.0",
"description": "My Superb Vue Project",
"main": "client/index.js",
"scripts": {
"test": "echo lol",
"build": "webpack --config build/webpack.prod.js",
"dev": "docker-compose up web",
"start": "node build/server.js",
"lint": "eslint client/* --ext .js --ext .vue",
"delopy":"sh build.sh"
},
"author": "李xx",
"license": "MIT",
"dependencies": {
"echarts": "^3.3.1",
"jade": "^1.11.0",
"jquery": "^3.1.1",
"lodash": "^4.16.6",
"moment": "^2.15.2",
"node-sass": "^3.11.2",
"sass-loader": "^4.0.2",
"store": "^1.3.20",
"urijs": "^1.18.2",
"vue": "^2.0.0",
"vue-i18n": "^4.7.1",
"vue-infinite-scroll": "^2.0.0",
"vue-resource": "^1.0.3",
"vue-router": "^2.0.0",
"vuex": "^2.0.0",
"vuex-router-sync": "^3.0.0"
},
"devDependencies": {
"autoprefixer": "^6.4.0",
"babel-core": "^6.16.0",
"babel-helper-vue-jsx-merge-props": "^2.0.1",
"babel-loader": "^6.2.4",
"babel-plugin-syntax-jsx": "^6.13.0",
"babel-plugin-transform-vue-jsx": "^3.1.0",
"babel-preset-es2015": "^6.14.0",
"babel-preset-stage-1": "^6.13.0",
"cross-env": "^2.0.0",
"css-loader": "^0.23.1",
"element-ui": "^1.0.0-rc.8",
"eslint": "^3.6.0",
"eslint-config-egoist-vue": "^2.0.2",
"express": "^4.14.0",
"extract-text-webpack-plugin": "^2.0.0-beta.3",
"file-loader": "^0.9.0",
"html-webpack-plugin": "^2.22.0",
"jade-loader": "^0.8.0",
"json-loader": "^0.5.4",
"postcss-loader": "^0.9.1",
"postcss-nested": "^1.0.0",
"progress-bar-webpack-plugin": "^1.9.0",
"style-loader": "^0.13.1",
"stylus": "^0.54.5",
"stylus-loader": "^2.3.1",
"vue-loader": "^9.3.2",
"webpack": "2.1.0-beta.22",
"webpack-dev-middleware": "^1.8.1",
"webpack-hot-middleware": "^2.12.2"
}
}

关键字示意图

package.json

name

项目名称

version

项目版本

description

项目描述

keywords

项目关键字,有助于npm search检索到你的模块

homepage

项目主页url

bugs

开源项目的issue提交地址

1
2
3
{ "url" : "https://github.com/owner/project/issues"
, "email" : "project@hostname.com"
}

license

项目许可证

1
"license": "MIT",

scripts

scripts指定了运行脚本命令的npm命令行缩写,比如start指定了运行npm run start时,所要执行的命令。
本项目中Vue-cli脚手架已经搭建的特别完备,手动指定自己需要的启动命令符

1
2
3
4
5
6
7
8
"scripts": {
"test": "echo lol",
"build": "webpack --config build/webpack.prod.js",
"dev": "docker-compose up web",
"start": "node build/server.js",
"lint": "eslint client/* --ext .js --ext .vue",
"delopy":"sh build.sh"
},

dependencies、devDependencies

dependencies字段指定了项目运行所依赖的模块,devDependencies指定项目开发所需要的模块
它们都指向一个对象。该对象的各个成员,分别由模块名和对应的版本要求组成,表示依赖的模块及其版本范围。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
"dependencies": {
"echarts": "^3.3.1",
"jade": "^1.11.0",
"jquery": "^3.1.1",
"lodash": "^4.16.6",
"moment": "^2.15.2",
"node-sass": "^3.11.2",
"sass-loader": "^4.0.2",
"store": "^1.3.20",
"urijs": "^1.18.2",
"vue": "^2.0.0",
"vue-i18n": "^4.7.1",
"vue-infinite-scroll": "^2.0.0",
"vue-resource": "^1.0.3",
"vue-router": "^2.0.0",
"vuex": "^2.0.0",
"vuex-router-sync": "^3.0.0"
},

对应的版本可以加上各种限定,主要有以下几种:

1
2
3
4
指定版本:比如1.2.2,遵循“大版本.次要版本.小版本”的格式规定,安装时只安装指定版本。
波浪号(tilde)+指定版本:比如~1.2.2,表示安装1.2.x的最新版本(不低于1.2.2),但是不安装1.3.x,也就是说安装时不改变大版本号和次要版本号。
插入号(caret)+指定版本:比如ˆ1.2.2,表示安装1.x.x的最新版本(不低于1.2.2),但是不安装2.x.x,也就是说安装时不改变大版本号。需要注意的是,如果大版本号为0,则插入号的行为与波浪号相同,这是因为此时处于开发阶段,即使是次要版本号变动,也可能带来程序的不兼容。
latest:安装最新版本。

一般情况下,package.json文件可以手工编写,也可以使用npm init命令自动生成;有了package.json文件,直接使用npm install命令,就会在当前目录中安装所需要的模块
如果一个模块不在package.json文件之中,可以单独安装这个模块,并使用相应的参数,将其写入package.json文件之中。

1
2
npm install express --save
npm install express --save-dev

单独安装express模块,–save参数表示将该模块写入dependencies属性,–save-dev表示将该模块写入devDependencies属性。

main

main字段指定了加载的入口文件,require(‘moduleName’)就会加载这个文件。这个字段的默认值是模块根目录下面的index.js。

engines

engines指明了该项目所需要的node.js版本

其他字段npm init创建时,没有提及,如有兴趣官网自己搬梯子!

文章目录
  1. 1.
  2. 2.
    1. 2.1. 概述
    2. 2.2. 关键字示意图
    3. 2.3. name
    4. 2.4. version
    5. 2.5. description
    6. 2.6. keywords
    7. 2.7. homepage
    8. 2.8. bugs
    9. 2.9. license
    10. 2.10. scripts
    11. 2.11. dependencies、devDependencies
    12. 2.12. main
    13. 2.13. engines
  3. 3.
|