npm与依赖包 - 润新知

npm与依赖包
引入：CommonJs

node应用由模块组成，CommonJS是模块化的标准。模块可分为：
1. 核心模块：node 提供的，可直接引入。（如HTTP模块、URL模块、Fs模块）
2. 自定义模块：自己写的，通过本地引入
3. 第三方模块：别人发布的，通过npm安装
下面主要讲的是第三方模块：

一 npm管理包

1.1 安装依赖

1.1.1 安装所有依赖

如果项目具有 package.json 文件，则通过运行下面命令安装项目所依赖的包
```
npm i
npm install
```
1.1.2 安装单个依赖
- 依赖：软件包会被列在 package.json 文件中的 dependencies （与生产环境中的应用程序相关）
```
npm install <package-name>
npm install --save <package-name>
```
- 开发依赖：软件包会被列在devDependencies （仅用于开发的程序包，在生产环境中并不需要。例如测试的软件包、webpack 或 Babel。）
```
npm install -D <package-name>
npm install --save-dev <package-name>
```
1.1.3 全局与局部安装
- 本地安装
  
  软件包会被安装到当前文件树中的 node_modules 子文件夹下。在这种情况下，npm 还会在当前文件夹中存在的 package.json 文件的 dependencies 属性中添加 vue条目。
```
npm install vue
```
- 全局安装
  
  在这种情况下，npm 不会将软件包安装到本地文件夹下，而是使用全局的位置。npm root -g命令会告知其在计算机上的确切位置。
```
npm install -g vue
```
通常，所有的软件包都应本地安装。这样可以确保计算机中可以有数十个应用程序，并且如果需要，每个应用程序都可以运行不同的版本。更新全局软件包会使所有的项目都使用新的版本，这可能会导致维护方面的噩梦，因为某些软件包可能会破坏与其他依赖项的兼容性等。

当程序包提供了可从 shell（CLI）运行的可执行命令、且可在项目间复用时，则该程序包应被全局安装。一些流行的全局软件包的示例有：
- npm
- create-react-app
- vue-cli
- grunt-cli
- mocha
- react-native-cli
- gatsby-cli
- forever
- nodemon
1.2 版本说明

1.2.1 介绍

所有的版本都有 3 个数字：x.y.z
- 第一个数字是主版本。
- 第二个数字是次版本。
- 第三个数字是补丁版本。
1.2.2 发布规则

当发布新的版本时，要遵循以下规则：
- 当进行不兼容的 API 更改时，则升级主版本。
- 当以向后兼容的方式添加功能时，则升级次版本。
- 当进行向后兼容的缺陷修复时，则升级补丁版本。
1.2.3 更新版本
- 更新所有
```
npm update	
```
  不会更新大版本，比如本地的是1.3.1，那么更新时只会更新到1.3.2或1.4.0
- 指定单个
```
npm update <package-name>
```
- 查看过期版本
```
npm outdated
```
1.2.4 更新版本控制

npm 设置了一些规则，可用于在 package.json 文件中选择要将软件包更新到的版本（当运行 npm update 时）。规则使用了这些符号：
- ^: 第一位版本号不变，后两位最新
- ~: 前两位不变，最后一位最新
- >: 接受高于指定版本的任何版本。
- >=: 接受等于或高于指定版本的任何版本。
- <=: 接受等于或低于指定版本的任何版本。
- <: 接受低于指定版本的任何版本。
- =: 接受确切的版本。
- ```: 接受一定范围的版本。例如：2.1.0 - 2.6.2`。
- ||: 组合集合。例如 < 2.1 || > 2.6。
1.2.5 安装指定版本
```
npm install <package>@<version>
npm install cowsay              //安装最近版本
npm install cowsay@1.2.0        //安装1.2.0 版本
npm install -g webpack@4.16.4
```
1.2.6 查看安装版本
```
npm list 
npm list --depth=0       //查看顶层软件包
npm list -g              //查看全局安装的软件包
npm list cowsay          //通过指定名称来获取特定软件包的版本
npm view cowsay version  //查看软件包在 npm 仓库上最新的可用版本
npm view cowsay versions //查看软件包所有的旧版本
```
1.3 卸载软件包
```
npm uninstall <package-name>
npm uninstall -S <package-name>     //会移除 package.json 文件中的引用
npm uninstall --save <package-name> //会移除 package.json 文件中的引用
npm uninstall -D <package-name>     //移除开发依赖项（列出在 package.json 文件的 devDependencies 中）
npm uninstall -g <package-name>     //移除全局安装的包
npm uninstall --global <package-name> //移除全局安装的包
```
1.4 使用包
```
npm install vue
const _ = require('vue')
```
require和import的区别：
- require是运行时调用，理论上可以运行在代码的任何地方；import是编译时调用，必须放在文件开头
- require是赋值过程，其实require的结果就是对象、数字、字符串、函数等，再把require的结果赋值给某个变量；import是解构过程，但是目前所有的引擎都还没有实现import，我们在node中使用babel支持ES6，也仅仅是将ES6转码为ES5再执行，import语法会被转码为require
二 pakage.json

package.json 是项目的清单。例如，它是用于工具的配置中心。它也是 npm 和 yarn 存储所有已安装软件包的名称和版本的地方。通过下面的命令可对项目进行初始化：
```
npm init
```
package.json 文件中的内容没有固定的要求。唯一的要求是必须遵守 JSON 格式，否则，尝试以编程的方式访问其属性的程序则无法读取它。
```
{
  "name": "test-project",
  "version": "1.0.0",
  "description": "A Vue.js project",
  "main": "src/main.js",
  "private": true,
  "scripts": {
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "start": "npm run dev",
  },
  "dependencies": {
    "vue": "^2.5.2"
  },
  "devDependencies": {
    "autoprefixer": "^7.1.2",
    "babel-core": "^6.22.1",
    "babel-eslint": "^8.2.1",
  },
  "engines": {
    "node": ">= 6.0.0",
    "npm": ">= 3.0.0"
  },
  "browserslist": ["> 1%", "last 2 versions", "not ie <= 8"]
}
```
- version 表明了当前的版本。
- name 设置了应用程序/软件包的名称。
- description 是应用程序/软件包的简短描述。
- main 设置了应用程序的入口点。
- private 如果设置为 true，则可以防止应用程序/软件包被意外地发布到 npm。
- scripts 定义了一组可以运行的 node 脚本。
- dependencies 设置了作为依赖安装的 npm 软件包的列表。
- devDependencies 设置了作为开发依赖安装的 npm 软件包的列表。
- engines 设置了此软件包/应用程序在哪个版本的 Node.js 上运行。
- browserslist 用于告知要支持哪些浏览器（及其版本）。
三 package-lock.json

该文件旨在跟踪被安装的每个软件包的确切版本。当运行 npm install时，npm 会使用这些确切的版本。

package-lock.json 文件需要被提交到 Git 仓库，以便被其他人获取。当运行 npm update 时，package-lock.json 文件中的依赖的版本会被更新。

下面是一个示例：
```
{
  "requires": true,
  "lockfileVersion": 1,
  "dependencies": {
    "ansi-regex": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.
0.0.tgz",
      "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
    },
    "cowsay": {
      "version": "1.3.1",
      "resolved": "https://registry.npmjs.org/cowsay/-/cowsay-1.3.1.tgz"
,
      "integrity": "sha512-3PVFe6FePVtPj1HTeLin9v8WyLl+VmM1l1H/5P+BTTDkM
Ajufp+0F9eLjzRnOHzVAYeIYFF5po5NjRrgefnRMQ==",
      "requires": {
        "get-stdin": "^5.0.1",
        "optimist": "~0.6.1",
        "string-width": "~2.1.1",
        "strip-eof": "^1.0.0"
      }
    },
    "get-stdin": {
      "version": "5.0.1",
      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-5.0.
1.tgz",
      "integrity": "sha1-Ei4WFZHiH/TFJTAwVpPyDmOTo5g="
    },
    "is-fullwidth-code-point": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/
is-fullwidth-code-point-2.0.0.tgz",
      "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
    },
    "minimist": {
      "version": "0.0.10",
      "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10
.tgz",
      "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8="
    },
    "optimist": {
      "version": "0.6.1",
      "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz",
      "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY=",

      "requires": {
        "minimist": "~0.0.1",
        "wordwrap": "~0.0.2"
      }
    },
    "string-width": {
      "version": "2.1.1",
      "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
      "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
      "requires": {
        "is-fullwidth-code-point": "^2.0.0",
        "strip-ansi": "^4.0.0"
      }
    },
    "strip-ansi": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
      "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
      "requires": {
        "ansi-regex": "^3.0.0"
      }
    },
    "strip-eof": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
      "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8="
    },
    "wordwrap": {
      "version": "0.0.3",
      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz",
      "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc="
    }
  }
}
```
安装 cowsay，其依赖于：
- get-stdin
- optimist
- string-width
- strip-eof
这些软件包还需要其他软件包，正如从 require 属性可以看到的：
- ansi-regex
- is-fullwidth-code-point
- minimist
- wordwrap
- strip-eof
每个都有 version 字段、指向软件包位置的 resolved 字段、以及用于校验软件包的 integrity 字符串。
相关阅读:
第九章统一连贯的段落《英语科技写作（文法与修辞原则）》by 方克涛
 第八章通顺的句子《英语科技写作（文法与修辞原则）》by 方克涛
 CMake使用操作解析参考1
发一个SharePoint修改好式样的菜单导航
 Jquery Ajax学习实例4向WebService发出请求，返回实体对象的异步调用
 修改SharePoint网站最大上载大小时有时需要关注的事项
 轻松Ajax.net实例教程13_TextBoxWatermarkExtender(按AjaxControlToolkit字母排序)
Jquery Ajax学习实例2向页面发出请求，返回JSon格式数据
 Jquery Ajax学习实例3向WebService发出请求，调用方法返回数据
 CSS语法学习总结
原文地址：https://www.cnblogs.com/sanhuamao/p/14759270.html

Copyright © 2020-2023 润新知