Vue实战专题

NPM实战

2019-04-13  本文已影响7人  极课编程

1.简介
npm有两层含义。一层含义是Node的开放式模块登记和管理系统,网址为npmjs.org。另一层含义是Node默认的模块管理器,是一个命令行下的软件,用来安装和管理Node模块。npm不需要单独安装。在安装Node的时候,会连带一起安装npm。但是,Node附带的npm可能不是最新版本,最好用下面的命令,更新到最新版本:

$ npm install npm@latest -g

查看版本信息:

$ npm -v

2.npm init
用来初始化创建一个package.json文件

# -y表示跳过提问阶段,直接生成一个package.json文件
$ npm init -y

3.npm info
用来查看每个模板的信息

# 查看babel模板信息
$ npm info babel-cli

4.4、npm search
用来搜索npm仓库

$ npm search <搜索词>

5、npm list
以树形结构列出当前项目安装的所有模板,以及它们依赖的模板

$ npm list

# 列出全局安装的模板
$ npm list -global

6、npm install
node模板通过这个命令来安装,有全局安装:指的是将一个模板安装到系统目录中,各个项目都可以调用;有本地安装:指的是将一个模板下载到当前项目的node_modules子目录中,然后只有在项目目录中,才能调用这个模板。

# 本地安装
$ npm install <package name>

# 全局安装
$ npm install -g <package name>
# 也可以安装github代码库地址:
$ npm install git://github.com/package/.....

安装github代码库之前,npm install会先检查,node_modules目录之中是否已经存在指定模板。如果存在,就不会再重新安装了。

7、-save和-save-dev
-save:模板名将被添加到dependencies(dependencies字段指定了项目运行所依赖的模板),可以简化为-S
-save-dev:模板名将被添加到devDependencies(devDependencies指定了项目开发所需要的模板),可以简化为-D

$ npm install react --save
$ npm install react -S

$ npm install react --save-dev
$ npm install react -D

npm install默认会安装dependencies字段和DevDependencies字段中的所有版本,如果使用--production参数,则只安装dependencies字段中的模板

$ npm install --production

ps:
也就是说,如果你在package.json的dependencies或者DevDependencies字段里将要安装的模板名及版本写入进去了,那么当你直接敲npm install时,那么就会安装相应的模板。
如果你是用来-save和-save-dev参数,那么就会安装相应的模板,然后将参数写入到package.json的dependencies字段或DevDependencies字段中。

8、npm update,npm uninstall
更新和卸载

$ npm update <package name>
$ npm uninstall <package name>

9、npm run
npm不仅可以用于模块管理,还可以用于执行脚本。package.json文件里有一个scripts字段,可以用于指定脚本命令,供npm直接调用。
比如,现在用browserify打包一个reactJs文件,scripts字段如下:

{
  "scripts":{
     "bundle":"browserify js\build\app.js -o bundle.js"
  }
}

现在输入npm run bundle就会打包这个文件

npm run命令会自动在环境变量$PATH添加node_modules/.bin目录,所以scripts字段里面调用命令时不用加上路径,这就避免了全局安装NPM模块。
npm run如果不加任何参数,直接运行,会列出package.json里面所有可以执行的脚本命令
举例来说,现在安装一个react-dom模板:

$ npm install react-dom --save-dev

运行上面的命令以后,会产生两个结果。首先,react-dom被安装到当前目录的node_modules子目录;其次,node_modules/.bin目录会生成一个符号链接node_modules/.bin/eslint,指向ESLint模块的可执行脚本。
然后,你就可以在package.json的script属性里面,不带路径的引用react-dom这个脚本。

上一篇下一篇

猜你喜欢

热点阅读