package.json

Node为前端工程化,模块化注入了新鲜的血液,而npm是其中关键的一环。对于刚接触这些新颖概念的我,此文作为学习笔记加强记忆帮助使用。

目前最新版本的Node环境已经集成了npm,下载Node便可使用了。

package.json:是一个用于包的依赖管理文件

package.json可以通过npm init命令生成。

执行命令后,它会像用户提问一系列问题,用于初始配置文件,当然即使你跳过此步骤,后续也可以继续修改。

愈要跳过此步骤:npm init -y

键入yes确认,生成json文件。

{
  "name": "studynpm",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

package.json中,有一些属性是必须写入的。即最少配置项

  • name

    • 全部为小写字母
    • 一个单词,无空格
    • 允许半角破折号和下划线
  • version

    • 遵循语义化版本控制规范(SemVer)
    • 格式为:x.y.z
    • z:bug修复,打补丁
    • y:新的功能,向下兼容。
    • x:新的版本发布,不向下兼容。

你可以通过set命令来提前设置好一些配置项。如:

npm set init.author.email "[email protected]"
npm set init.author.name "ag_dubs"
npm set init.license "MIT"

Package.json 属性说明

  • name - 包名
  • version - 包的版本号
  • description - 包的描述
  • **homepage - 包的官网 url **
  • author - 包的作者姓名
  • contributors - 包的其他贡献者姓名
  • dependencies - 依赖包列表。如果依赖包没有安装,npm 会自动将依赖包安装在 node_module 目录下
  • repository - 包代码存放的地方的类型,可以是 git 或 svn,git 可在 Github 上
  • main - main 字段指定了程序的主入口文件,require('moduleName') 就会加载这个文件。这个字段的默认值是模块根目录下面的 index.js
  • keywords - 关键字(便于检索)

接下来演示一些基本用法。


在前端上古时期,没有包、模块等概念的时候,要在浏览器中使用jQuery最常见的做法就是,找到官网——复制or下载源码——贴入src这样的操作了。

那么,在node中,我们如何使用jQuery?

首先cd到项目目录,生成package.json文件,随后观察这个json文件,注意发现有什么改变。

{
  "name": "studynpm",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

CLI中键入npm install jquery
执行这条命令的时候,终端会链接到npm服务器,寻找是否存在这个名字的包。如果不存在,会返回error。

正确输入package name后,自动下载到当前目录下的node_modules目录中。

所有通过npm安装的包都会存放在当前项目node_modules目录下。

又安装了一个包

有一些包和工具必须全局安装(比如eslint和gulp)才能方便使用,这里要用到全局安装命令。

npm install -global 
npm install -g 

这样就会将包安装在根目录下。

那么现在,想要在HTML页面中引入jQuery,我们可以:




    
    
    
    Document


    
    


浏览器打开:


那么问题来了,目录下文件那么多,我们怎么知道是/jquery/dist/jquery.js呢?
这些都写在了包自带的package.json中。

main属性就指定了这个包的入口文件,通俗的说,如果你想用它,从“这里”开始。


好了,现在假设你离职了,后续的人需要接管你的代码,那么他怎么知道你这个项目依赖什么包呢?靠的也是package.json。

现在回到install之前的package.json文件中,发现到了什么变化吗?

{
  "name": "studynpm",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "jquery": "^3.3.1",
    "vue": "^2.5.17"
  }
}

多了一个属性,dependencies,翻译过来:依赖,顾名思义,这个属性就是管理你当前包的依赖的。
并且详细到,依赖的包的版本号也会纪录。

现在,我们手动删除node_modules目录。


现在想回到之前的开发环境怎么办?

既然有package.json,直接npm insatll

又回来了,这样,别人需要知道你的依赖,直接发package.json文件给他就好了。

怎么知道一个包是否存在呢?
进入npm官网查询。


或者使用npm search

npm search

npm search命令用于搜索npm仓库,它后面可以跟字符串,也可以跟正则表达式。

以往的npm,将一个包保存入dependencies属性需要命令:npm install --save,也就是说,你要明确指定save in dependencies,它才会将此包作为依赖放入dependencies属性内。

新版本npm中,通过npm install安装的包都会自动添加进入dependencies,这是默认的。

如何更新依赖?

npm update

// 升级当前项目的指定模块
npm update [package name]

//升级全局安装的模块
npm update -global [package name]

它会先到远程仓库查询最新版本,然后查询本地版本。如果本地版本不存在,或者远程版本较新,就会安装。

使用-s--save参数,可以在安装的时候更新package.json里面模块的版本号。

// 更新之前的package.json
dependencies: {
  package1: "^1.1.1"
}

// 更新之后的package.json
dependencies: {
  package1: "^1.2.2"
}

如果需要指定安装版本,可以在package name后@版本号

npm install [email protected]

当然,更新之后,dependencies内的版本号也会改变。

如何卸载一个包呢?

本地卸载:npm uninstall

同时,package.json的dependencies属性也会删除此依赖。当然,也可以手动删除它。
npm uninstall --save vue

全局卸载:npm uninstall -g


有时候,当我们开发一个项目时,一些包只是作为开发依赖,并不是项目必须的,比如一些测试工具,不会在生产环境下运行。

那么就涉及到devDependencies项了。
devDependencies指定项目开发所需要的模块。

{
  "name": "studynpm",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "jquery": "^3.3.1"
  },
  "devDependencies": {
    "webpack": "^4.19.0"
  }
}

package.json —— bin字段
bin字段用来指定各个内部命令对应的可执行文件的位置。

"bin": {
  "start": "./bin/start.js"
}

上面代码指定,start命令对应的可执行文件为bin字目录下的start.js文件,node会寻找这个文件


一些常用命令

npm update :更新node模块

npm rebuild :用于更改包内容后进行重建

npm view dependencies:查看包的依赖关系

npm view repository.url:查看包的源文件地址

npm view engines:查看包所依赖的Node的版本

npm outdated:检查包是否已经过时,此命令会列出所有已经过时的包,可以及时进行包的更新

npm update moduleName:更新node模块

你可能感兴趣的:(package.json)