使用NPM

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 有以下好处:

  1. 超快的下载速度。
  2. 离线下载,如果你懂 ruby,这个有点像 bundle,就是之前下载过一次,这个包就会放到电脑上的一个地方,下次别的项目要使用同一个包的时候就不用下载了,而是做一个链接,这样速度超级快,这一点很重要,npm 饱受诟病的一点就是,每次安装依赖,都需要从网络下载一大堆东西,而且是全部重新下载。工程多的时候比较烦人。这下子可以节约大量时间了。
  3. 拥有 lockfile 文件,在 yarn 中叫 yarn.lock,这个在新版的 npm 也有这个功能,它的文件名叫 package-lock.json,这个文件会记录每次安装的包的版本的精确信息,这样,每次运行 yarn install 就会得到一模一样的依赖环境,而不是会出现个别包的版本不同,从而引发环境问题导致项目运行情况不同的尴尬事件。

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

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Node.js基础10:理解NPM、package.json、使用nodemon

    我们写项目的时候,每改写一个功能就要把服务器重启一次,比如运行node app,这样比较麻烦,我们可以让代码一改变服务器就自动重启。这个工具就是nodemon

    代码之风
  • MVC中的M(model)、MVC总结

    这篇博客的源代码是我的正在写的在线简历,博客是继上一篇写的 完整代码(项目暂未完成) 预览地址

    代码之风
  • 虚拟DOM

    DOM 是 JavaScript 操作网页的接口,全称为“文档对象模型”(Document Object Model)。它的作用是将网页转为一个 JavaScr...

    代码之风
  • VUE+Element环境搭建与安装

    如果你的文件夹中没有node_modules的文件,那么你就要在命令行中打开你的项目并输入:

    王小婷
  • 【2016多校训练4】Multi-University Training Contest 4

    树状数组维护数字i前面有多少个比它小的数,即第几小。最左距离就是rank,最右距离就是max(原位置,终位置),求出距离极差即可。

    饶文津
  • 什么是区块链预言机(BlockChain Oracle)

    预言机(Oracle)是区块链中非常重要的一个功能,但我发现很少有人讨论,也可能很多人对此并不了解。而网上关于预言机的文章较少,很多也没有讲明白,甚至有些还是错...

    辉哥
  • 【hdu 6161】Big binary tree(二叉树、dp)

    有一个完全二叉树。编号i的点值是i,操作1是修改一个点的值为x,操作2是查询经过点u的所有路径的路径和最大值。105个点,108次操作。

    饶文津
  • 投了6578份简历,喜提offer的我有6点建议,给备战春招的你

    导读:投了数百封简历,接到面试的却寥寥无几。求职的我们,总有觉得无能为力的时候。今天就给大家提供一些可以提升拿到面试几率的策略。接下来这些步骤,如果各位数据人能...

    华章科技
  • nginx+php-fpm故障排查

    小明初到一家公司做运维的工作,刚来的第一天就开始部署LNMP(Linux+Nginx+MySQL+PHP)环境,结果出现了问题。 他来向我请教。

    [3306 Pai ] 社区
  • 【kAriOJ】离散数学春季学期编程测试 1

    给你n,e,和一串明文。用(n,e)加密明文。将明文字母转换成数字,按8位数字分段,不足部分补足0。明文中有非字母删除,A和a转成数字都是00, Z和z转成数字...

    饶文津

扫码关注云+社区

领取腾讯云代金券