使用NPM

wanghui 发布于2019-08-23 12:30 / 724人阅读

摘要：另一方面，这样做也无法支持不同项目使用不同版本的。我们可以换一个源，即把服务器换到国内，例如淘宝的源运行下面的命令即可切换淘宝源的配置被存储在，你可以随时改。安装方法使用方法切换源等见链接

Nodejs生态圈很强大，第一个原因就是NPM，因为全球有无数的程序员在NPM中贡献了自己的力量。

为了避免造轮子，我们有时候会用到其他人的劳动成果，比如一些优秀的框架，比如Express，我们直接使用NPM下载下来就可以用了，降低开发成本和时间。

安装

安装好nodejs后就安装好了npm，这时系统自带npm命令

如何使用

以为Express来举例。
npm 的官网可以找到 npm 包。
https://www.npmjs.com/
例如搜索Express，就会告诉你安装方法和使用方法：

安装Express

新建一个文件夹，然后运行：
npm init初始化，一直按回车，它会自动生成package.json 文件，这个后面再说这个文件的作用。
然后
npm install express安装

会出现node_modules文件夹

node_modules文件夹就是所有包安装的位置。
express已经安装到了node_modules文件夹，其他的很多文件都是这个express依赖的包

package.json 文件

我们写一个项目的时候可能会用到很多很多包，这些包可能是一些工具，也可能是框架。我们每使用一个包，就会把这些包下载下来，然后他会放到node_modules目录中。
那么项目如果太大，哪些包安装了哪些没安装，我们如何知道呢？有没有一个机制来记住我们安装的包呢？
有，nodejs提供了一个机制叫package.json。
他是一个文件，他可以记住所有安装的包的信息，包括名称、版本信息。
如果我们迁移项目，我们就能够知道安装了什么包。因为node_modules目录中文件比较大，而且不放在版本控制中（github等），也不是源码的一部分，我们只要知道node_modules里安装的一些包的名字就可以了，根本不需要这个目录的内容。

比如说现在一个同事得到了这一份代码，那么这个node_modules目录中的代码他是不需要的。因为他只需要安装过得这些包的名称就可以了，到他自己的电脑上再安装就可以了。

package.json就是记录所有安装的包的信息的文件。

生成方法

运行npm init初始化一个项目。
他会让你回答一些关于这个项目的信息，一直按回车，因为这些信息后面可以改，最开始使用默认的就好。

然后就会生成一个package.json的文件。

举例：尝试安装Express并查看package.json

npm install --save express

安装之后出现很多包，这些都是express依赖的包。

"dependencies"

安装后出dependencies字段会出现安装的包的详细信息，包括包的名称和版本号。
"dependencies"中文是依赖的意思。

"devDependencies"

devDependencies是开发环境依赖的意思。例如我们用下面的命令行安装gulp
npm install --save-dev gulp

开发环境的包会记录在这里
使用--save-dev就是开发环境依赖的一些包，会记录到devDependencies

"scripts"中的"start"

在"scripts"里加入一行"start": "node app.js"，

"scripts": {
    "test": "echo "Error: no test specified" && exit 1",
    "start": "node app.js"
  },

那么如果我们运行npm run start

就会运行"start"里面的命令。

作用：别人下载你的代码之后可能不知道怎么运行你的项目，那么你把这些命令写在start里，那么项目入口文件之类的就一目了然。

使用package.json 命令：npm install

package.json记录了安装包的所有安装信息，那么别人得到这些信息如何把这些包安装下来呢（安装到他的本地）
使用命令npm install就可以了，比如我们现在删掉node_modules，然后再运行npm install
他就会重新安装

"dependencies": {
    "express": "^4.16.4"
  },
  "devDependencies": {
    "gulp": "^3.9.1"
  }

这两个依赖中的包

全局安装与局部安装的区别 全局安装

比如我们安装webpack
npm install -g webpack
-g 意思是Global,全局的意思，他会把webpack作为一个命令，一个可执行文件，安装到我们的系统中，以后我们就可以使用这个命令了

局部安装

局部安装只安装到这个项目当前的文件夹中,如果想使用webpack命令，就要运行使用当前项目下的文件，才能运行webpack
node_modules/.bin/webpack

Babel举例说明

用Babel举例说明全局安装与局部安装的区别：

命令行转码babel-cli————阮一峰的es6教程

上面代码是在全局环境下，进行 Babel 转码。这意味着，如果项目要运行，全局环境必须有Babel，也就是说项目产生了对环境的依赖。另一方面，这样做也无法支持不同项目使用不同版本的 Babel。

一个解决办法是将babel-cli安装在项目之中。

总结：全局安装的话你的项目不容易更新，因为不同项目使用的babel的版本可能不同，而且你和你团队使用的babel的版本也可能不同。所以要把babel直接安装在项目中。这样其他人拿到项目再安装项目内的babel，就不会出现版本不兼容问题了。

http-server举例说明

再比如我们安装http-server
npm install -g http-server

安装在了这个目录下新增的一个文件，叫做http-server

npm install -g的时候安装在全局目录下，npm install不带-g的时候安装在当前目录下，如图

如果是全局安装，那么直接就可以用了，因为Mac中 /usr/local/bin 是包含在path里面的。

如果我直接在命令行里输入http-server，那么会访问到/usr/local/bin这个路径里的http-server文件

如果只安装在了局部的项目里，想用的话就去当前目录下去找http-server这个文件，一样可以用：

命令行的实质就是一个文件而已！全局命令就是装在环境里的文件！局部命令就是放在一个目录里，用的时候需要执行局部文件！

切换淘宝源

注意：在国内安装这些包的时候有时候会很慢，因为这些包的服务器在国外。我们可以换一个源，即把服务器换到国内，例如淘宝的源

运行下面的命令即可切换淘宝源

npm config set registry https://registry.npm.taobao.org/
npm config set loglevel http
npm config set progress false

npm 的配置被存储在 ~/.npmrc，你可以随时改。

这是官方网站
https://npm.taobao.org/

安装node-sass的正确姿势

安装node-sass的正确姿势

从 npm 到全面拥抱 yarn

从 npm 到全面拥抱 yarn

个人觉得 yarn 有以下好处：

超快的下载速度。

离线下载，如果你懂 ruby，这个有点像 bundle，就是之前下载过一次，这个包就会放到电脑上的一个地方，下次别的项目要使用同一个包的时候就不用下载了，而是做一个链接，这样速度超级快，这一点很重要，npm 饱受诟病的一点就是，每次安装依赖，都需要从网络下载一大堆东西，而且是全部重新下载。工程多的时候比较烦人。这下子可以节约大量时间了。

拥有 lockfile 文件，在 yarn 中叫 yarn.lock，这个在新版的 npm 也有这个功能，它的文件名叫 package-lock.json，这个文件会记录每次安装的包的版本的精确信息，这样，每次运行 yarn install 就会得到一模一样的依赖环境，而不是会出现个别包的版本不同，从而引发环境问题导致项目运行情况不同的尴尬事件。

安装方法、使用方法、切换源等见链接

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/98644.html

NPM简单入门

摘要：使用淘宝镜像大家都知道国内直接使用的官方镜像是非常慢的，这里推荐使用淘宝镜像。淘宝镜像是一个完整镜像，你可以用此代替官方版本只读，同步频率目前为分钟一次以保证尽量与官方服务同步。 npm 使用介绍 NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种：允许用户从NPM服务器下载别人编写的第三方包到本地使用。允许用户从NPM...

ckllj 2019-08-20 10:40 评论0 收藏0
你可能不知道的 npm 实用技巧

摘要：但这并不意味着依赖版本是锁死的。黄色表示不符合指定的语义化版本范围，比如大版本升级，升级可能会遇到兼容性问题。文件可以列出不想打包的文件，避免把一些无关的文件发布到上。作者： LeanCloud weakish 分享一些 npm 包管理工具的实用小窍门，希望能够略微提高下前端、Node.js 开发者的生活质量。绝大多数前端和 Node.js 开发者每天的日常工作都离不开 npm，不...

NickZhou 2019-08-23 18:28 评论0 收藏0
构建自己的npm包简单实现

摘要：使用介绍是随同一起安装的包管理工具，能解决代码部署上的很多问题，常见的使用场景有以下几种允许用户从服务器下载别人编写的第三方包到本地使用。允许用户将自己编写的包或命令行程序上传到服务器供别人使用。 NPM 使用介绍 NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种：允许用户从NPM服务器下载别人编写的第三方包到本地使用。...

frontoldman 2019-08-20 18:22 评论0 收藏0
一篇 NPM 常见问题小记

摘要：常见问题的中的和会匹配最近的小版本依赖包，比如会匹配所有版本，但是不包括会匹配最新的大版本依赖包，比如会匹配所有的包，包括，但是不包括你也有可能会看见在中模块的版本号前面既没有也没有就像下面那样上面的情况属于精确安装模块指定的版本号。常见问题 1.npm 的package.json中的~和^ ~会匹配最近的小版本依赖包，比如~1.2.3会匹配所有1.2.x版本，但是不包括1.3.0...

lvzishen 2019-08-22 15:10 评论0 收藏0
2018 年了，你还是只会 npm install 吗

摘要：无需手动拷贝文件或者创建软链接到目录，有更优雅的解决方案。这是因为识别协议的，得知这个包需要直接从文件系统中获取，会自动创建软链接到中，完成安装过程。 nodejs 社区乃至 Web 前端工程化领域发展到今天，作为 node 自带的包管理工具的 npm 已经成为每个前端开发者必备的工具。但是现实状况是，我们很多人对这个nodejs基础设施的使用和了解还停留在: 会用 npm insta...

libxd 2019-08-22 15:41 评论0 收藏0
前端核心工具：yarn、npm、cnpm三者如何优雅的在一起使用？

摘要：由于文件中版本号的特点，下面三个版本号在安装的时候代表不同的含义。安装版本统一为了防止拉取到不同的版本，有一个锁定文件记录了被确切安装上的模块的版本号。 showImg(https://segmentfault.com/img/bVbs8Rg?w=1920&h=1080); 一位用不好包管理器的前端，是一个入门级前端，一个用不好webpack的前端，是一个初级前端三个包管理器是可以一...

sihai 2019-08-26 13:56 评论0 收藏0