package.json文件

dependencies和devDependencies配置

编写时间：2019-06-28
更新时间：2019-7-31 11:43

做者：鬼小妞

目的：本文旨在帮助一些刚项目开发的人员了解

• 如何建立package.json； （点击直达）；
• package.json参数简介； （点击直达）；
• 安装依赖的三种方式：:npm install、npm install --save、npm install --save-dev； （点击直达）；
• 使用--save仍是--save-dev；添加到开发环境仍是生产环境？ （点击直达）；
• 项目负责人和其余项目开发者在安装依赖时应该如何作 （点击直达）；

备注： 本文整理及编写了与项目安装依赖相关的一些知识，仅供参考，描述不当的地方，请评论指正

状态：待完善2019-7-31

在看这篇文章以前，建议你先看一下阮一峰老师写的这篇教程： package.json文件

疑问：在一个项目中，我把代码提交到Git上，别人Clone下来以后，怎么知道我须要下载哪些依赖库

咱们clone代码以后，你会发现是没有node_modules这个文件夹的，node_modules用来保存依赖库，此时咱们就须要经过npm install来下载依赖库，可是须要下载哪些库，这时候就须要定义package.json，配置好dependencies和devDepencies，这样项目其余开发人员在执行npm install 命令的时候，就能够下载对应的依赖库了

package.json简介

每一个项目的根目录下面，通常都有一个package.json文件，定义了这个项目所须要的各类模块，以及项目的配置信息（好比名称、版本、许可证等元数据），开发人员通常在git clone项目后使用npm install命令根据这个配置文件(里的dependencies和devDependencies参数)，自动下载所需的模块，也就是配置项目所需的运行和开发环境。

建立package.json

• 步骤式建立(需按步骤手动输入配置)

npm init

• 一步自动建立（自动默认配置）

npm init -y

package.json参数简介

name: 项目名称

---

version: 项目版本号

---

description: 项目描述

---

keywords: {Array}关键词

便于用户搜索到咱们的项目

---

homepage: 项目url主页

---

license: 项目许可证.

让使用者知道是如何被容许使用此项目。默认是”ISC”

---

author,contributors: 做者和贡献者。

author,contributors 的格式设置以下： { “name” : “Barney Rubble” , “email” : “b@rubble.com” , “url” : “barnyrubble.tumblr.com/” }

---

bugs: 项目问题反馈的Url或email配置

如： {
“url” : “github.com/owner/proje…, “email” : “project@hostname.com” }

---

main : 主文件。

好比默认是index.js，项目名称叫mymodule。那么require(‘mymodule’)将返回index.js返回的内容

---

bin : 项目用到的可执行文件配置

---

man : 指定一个单一的文件名或一个文件名数组。

意思相似于linux命令中的man 命令，来查看一个命令的用法 若是只给man字段提供一个文件，则安装完毕后，它就是man 的结果，这和此文件名无关

{ “name”: “foo”, “version”: “1.2.3”, “description”: “A packaged foo fooer for fooing foos”, “main”: “foo.js”, “man”: “./man/doc.1” } 上面这个配置将会在执行man foo时就会使用./man/doc.1这个文件。

若是指定的文件名并未以包名开头，那么它会被冠之前缀，像这样

{ “name”: “foo”, “version”: “1.2.3”, “description”: “A packaged foo fooer for fooing foos”, “main”: “foo.js”, “man”: [ “./man/foo.1”, “./man/bar.1” ] } 这将会为man foo和man foo-bar建立文件

man文件必须以一个数字结尾，和一个可选的.gz后缀(当它被压缩时)。这个数字说明了这个文件被安装到哪一个节中

{ “name”: “foo”, “version”: “1.2.3”, “description”: “A packaged foo fooer for fooing foos”, “main”: “foo.js”, “man”: [ “./man/foo.1”, “./man/foo.2” ] } 会为使用man foo和man 2 foo而建立

---

directories : CommonJS Packages规范

说明了几种你能够用directories对象来标示你的包结构的方法

---

directories.lib : 库文件夹的位置

目前没有什么地方须要用到lib文件夹，可是这是重要的元信息

---

directories.bin : 若是你在directories.bin中指定一个bin目录，在这个目录中的全部文件都会被当作在bin来使用。

因为bin指令的工做方式，同时指定一个bin路径和设置directories.bin将是一个错误。若是你想指定独立的文件，使用bin，若是想执行某个文件夹里的全部文件，使用directories.bin。

---

directories.doc : 把markdown文件放在这。也许某一天这些文件将被漂亮地展现出来，不过这仅仅是也许

---

directories.man : directories.man指定的文件夹里都是man文件，系统经过遍历这个文件夹来生成一个man的数组

---

directories.example : 把示例脚本放在这。也许某一天会被用到

---

repository : 项目代码存放地方

“repository” : 
{ “type” : “git” 
, “url” : “https://github.com/npm/npm.git” 
} 
“repository” : 
{ “type” : “svn” 
, “url” : “https://v8.googlecode.com/svn/trunk/” 
}

复制代码

---

scripts : 声明一系列npm脚本指令

---

prepublish : 在包发布以前运行，也会在npm install安装到本地时运行

---

publish,postpublish : 包被发布以后运行

---

preinstall : 包被安装前运行

---

install,postinstall : 包被安装后运行

---

preuninstall,uninstall : 包被卸载前运行

---

postuninstall : 包被卸载后运行

---

preversion : bump包版本前运行

---

postversion : bump包版本后运行

---

pretest ,test ,posttest : 经过npm test命令运行

---

prestop ,stop ,poststop : 经过npm stop命令运行

---

prestart ,start ,poststart : 经过npm start命令运行

---

prerestart ,restart ,postrestart : 经过npm restart运行

"scripts": {

   "dev": "npm run start",

    "dist": "cross-env NODE_ENV=production node ./tools/script.js",

    "lint": "eslint src/ --ext .js,.vue && stylelint \"src/**/*.vue\" --syntax less",

    "lint:js": "eslint src/ --ext .js,.vue",

    "lint:style": "stylelint src/**/*.less --syntax less",

    "pub": "npm run dist",

    "start": "cross-env NODE_ENV=development node ./tools/script.js",

    "test": ""

    }
    
复制代码

---

config : 配置项目中须要的配置参数：

{ 
“name” : “foo” , 
“config” : { “port” : “8080” } , 
“scripts” : { “start” : “node server.js” } 
} 
    
复制代码

server.js中使用process.env.npm_package_config_port来访问port 用户也能够这样修改：npm config set foo:port 80

---

dependencies : 项目在生产环境中依赖的包

---

devDependencies : 项目在开发和测试环境中依赖的包

---

peerDependencies : 在某些状况下，当一个主机没法require依赖包时，你会想要告诉它还有哪些工具或库与这个依赖包兼容。这一般被成为一个插件。尤为是在host文档中声明的模块会暴露一个特定的接口

{ 
    “name”: “tea-latte”, 
    “version”: “1.3.5”, 
    “peerDependencies”: { 
    “tea”: “2.x” 
    } 
}
复制代码

这将确保tea-latte这个包只会和2.x版本的tea一块儿被安装。执行npm install tea-latte可能产生如下关系图：

├── tea-latte@1.3.5 
└── tea@2.2.0
复制代码

---

bundledDependencies : {Array}，发布时会被一块儿打包的模块

---

optionalDependencies : 若是一个依赖模块能够被使用， 同时你也但愿在该模块找不到或没法获取时npm继续运行，你能够把这个模块依赖放到optionalDependencies配置中。这个配置的写法和dependencies的写法同样，不一样的是这里边写的模块安装失败不会致使npm install失败。固然，这种模块就须要你本身在代码中处理模块确实的状况了，例如：

try { 
var foo = require(‘foo’) 
var fooVersion = require(‘foo/package.json’).version 
} catch (er) { 
foo = null 
} 
if ( notGoodFooVersion(fooVersion) ) { 
foo = null 
} 
// .. then later in your program .. 
if (foo) { 
foo.doFooThings() 
}

复制代码

---

engines : 声明项目须要的node或npm版本范围

{ “engines” : { “npm” : “~1.0.20” } } 
{ “engines” : { “node” : “>=0.10.3 <0.12” } }
复制代码

---

os : 指定你的项目将运行在什么操做系统上

---

cpu : 指定你的项目将运行在什么cpu架构上

---

preferGlobal : 若是你的包须要全局安装，经过命令行来运行，那么设置为true。若是这个包被本地安装则会出现一个警告

---

private : 若是设置为true, 那么npm会拒绝发布它

publishConfig

---

package.json的dependencies和devDependencies是什么意思

• devDependencies本地环境开发环境（开发环境）
• dependencies用户发布环境（项目所需的运行环境）

安装依赖的三种方式

• npm install:将依赖模块安装到项目，但不写package.json（不推荐，这样最终须要手动添加）；

• npm install --save:将模块安装到项目，写入的package.json的dependencies（生产环境）中；

• npm install --save-dev:将模块安装到本地，写入package.json的devDependencies（开发环境）中。

如何知道使用--save仍是--save-dev；添加到开发环境仍是生产环境？

• 使用--save仍是--save-dev dependencies依赖的包不只开发环境能使用，生产环境也能使用 按照这个观念很容易决定安装模块时是使用--save仍是--save-dev

• 添加到开发环境仍是生产环境

  • 【npm install --save】添加到生产环境dependencies的通常是项目所使用的框架。或者说项目正常运行须要的东西。 好比你在开发一个前端框架，这个框架是依赖与 jQuery 的， jQuery 就是 dependencies， 你试试没有把jQuery添加到dependencies。哈哈哈，恭喜你，等着修bug吧。 其余的dependencies如，vue，angular，electron，express。

  • 【npm install --save-dev】添加到开发环境devDependencies的通常是项目所使用的工具和插件。 没有这些工具，你就没办法项目开发。 好比你在开发是用到的 gulp，grunt，webpack之类的打包工具和插件。没有这些打包工具，项目能正常运行，可是没法进行项目打包。

  • 项目正常运行，和项目被打包有毛关系啊，因此，分清楚项目运行和项目开发

项目负责人：配置package.js的dependencies和devDependencies时：

• 使用npm install --save将模块安装到项目，写入的package.json的dependencies（生产环境），例如：

  npm install vue@3.0 --save
  复制代码

  • 生产环境只须要咱们能正常运行该项目所须要的模块， 好比vue，vue-router，express，jQuery等等这些，项目没有这些依赖会出错

• 使用npm install --save-dev写入的package.json的devDependencies（开发环境），例如：

  npm install webpack@3.0 --save-dev 
  复制代码

开发环境就是开发阶段，咱们所作的单元测试，webpack，gulp，supervisor等这些工具，都只是在开发阶段须要，一旦项目投入须要便再也不须要。

项目其余开发人员：从git上pull下来项目来开发时

通常只须要：

• 【下载项目依赖】
  • 必定要进入对应的项目文件夹下，使用npm install 默认安装dependencies和devDependencies中的模块，若是只须要安装生产环境中的模块使用npm install -production

通常咱们只须要使用npm install下载完依赖就能够运行的，可是，若是你没有安装过git、node/npm等，就须要【根据开发文档配置开发环境】

• 【根据开发文档配置开发环境】
  • 如，安装node对应版本，安装webpack等，通常使用 -g安装node/npm全局模块，例如，使用

  npm install webpack@3.5.1 -g
  复制代码

  • 请注意，必定要根据项目的package.json里的dependencies和devDependencies来安装全局模块

参考

• PACKAGE.JSON---入门说明
• package.json文件————（阮一峰）
• 你真的理解devDependencies和dependencies区别吗?
• dependencies和devDependencies的正确使用姿式
• Electron + Vue + Vscode构建跨平台应用（二）Electron + Vue环境搭建