npm的使用

raymon
513 阅读8分钟

npm下载使用包

分成三步

  • 初始化项目。npm init 如果之前已经初始化，则可以省略。
  • 安装包。 npm install 包名。
  • 引入模块，使用。

保持联网的状态哈

第一步：初始化项目

这里提到的项目并不是某个具体的功能，只是要创建一个空文件夹即可（注意，不要起中文名字哈）。

进入到项目所在的根目录下，启动小黑窗（按下shift键，点击右键，在弹出的菜单中选择 “在此处打开命令行”）

输入如下命令：


npm init --yes
// --与yes之间没有空格， -- 与init之间有空格
// 或者是 npm init -y

init命令用来在根目录下生成一个package.json文件，这个文件中记录了我们当前项目的基本信息，它是一切工作的开始。

第二步：安装包

npm 这个超市上有好的代码，我们想下载来用 ------ 安装包

生成了package.json文件之后，我们就可以来安装第三方包了。在npm官网中，有上百万个包，供我们使用（你需要在npm网上注册帐号，登陆上去，才可以看到如下的数据，如果只是下载安装包，则并不需要注册）。

安装day.js包

day.js是一个专门用来处理日期时间的一个包。网站：dayjs.fenxianglu.cn/


npm install dayjs

第三步：使用包

当我们已经下载好一个包之后，就可以像使用核心模块一样去使用它。

格式是：const 常量名 = require('包名')

这个格式与引入核心模块的格式是一样的。


// 从npm下载 别人写的好代码，在本地引入，并使用
const dayjs = require('dayjs')
console.log(dayjs);
console.log( dayjs().format('YYYY-MM-DD') );

npm init 命令

在某个目录下开启小黑窗，输入如下命令：


# init 初始化
npm init

它会启动一个交互式的程序，让你填入一些关于本项目的信息，最后生成一个package.json文件。

如果你希望直接采用默认信息，可以使用:


npm init --yes
// 或者是 npm init -y

说明：

  • 这个命令只需要运行一次，它的目的仅仅是生成一个package.json文件。
  • 如果项目根目录下已经有了package.json文件，就不需要再去运行这个命令了。
  • 这个package.json文件后期是可以手动修改的。

package.json文件

它一般是由npm init命令创建出来的，它的整体内容是一个json字符串，用来对当前项目进行整体描述。其中最外层可以看作是一个js的对象（每一个属性名都加了""，这就是一个典型的json标记）。这个文件中有非常多的内容，我们目前学习如下几个：

  • name： 表示这个项目的名字。如是它是一个第三方包的话，它就决定了我们在require()时应该要写什么内容。
  • version：版本号
  • keywords：关键字
  • author: 作者
  • descrption: 描述

npm镜像-让下包更快

如何设置镜像

设置镜像为taobao。

npm config set registry registry.npm.taobao.org

设置镜像为npm官方

npm config set registry registry.npmjs.org

查看配置

npm config get registry

包的分类

image.png

安装全局包和项目包

我们通过npm install 命令来安装包，简单说就是把包从npm的官网（或者是指定的镜像源）下载到我们自己的电脑中。那具体这个包下载到哪里了，还是有一点讲究的。

分成两类：

  • 全局安装: 包被安装到了系统目录（一般在系统盘的node_modules中）。

    • 命令：npm install -g 包名 或者 npm install 包名 -g

    • 辅助提示：

      • 
npm root -g           // 查看全局包的安装目录
npm list -g --depth 0 // 查看全局安装过的包

  • 项目安装（或者叫本地安装)，包安装在当前项目的根目录下（与package.json同级）的node_modules中。

    • ​ 命令：npm install 包名

全局包与项目包的区别

  • 全局安装的包一般可提供直接执行的命令。我们通过对一些工具类的包采用这种方式安装，如：

    gulp, nodemon, live-server, nrm等。

  • 本地安装的包是与具体的项目有关的， 我们需要在开发过程中使用这些具体的功能。

一个经验法则：

  • 要用到该包的命令执行任务的就需要全局安装。
  • 要通过require引入使用的就需要本地安装-项目包。

全局安装nrm包

nrm 这个工具是帮助我们切换npm镜像源的。

之前是：


# 设置镜像为taobao。
npm config set registry https://registry.npm.taobao.org
# 设置镜像为npm官方
npm config set registry https://registry.npmjs.org

使用nrm之后，就可以简化上面的命令。

步骤

共三步


// 第一步： 全局安装 
npm install nrm -g
​
// 第二步：列出所有的源信息
// （*）标注的就是当前使用的源
nrm ls
​
// 第三步：根据需要切换源 
// 例如：指定使用taobao镜像源
nrm use taotao
​
// 接下来，正常安装你需要的包

如果nrm ls不能用，请看这里：

blog.csdn.net/LQCV587/art…

const NRMRC = path.join(process.env[(process.platform == 'win32') ? 'USERPROFILE' : 'HOME'], '.nrmrc');

//const NR

npm项目初始化

在本地磁盘上创建一个空项目，取文件夹名为myNpm。注意请先去npm网官去确定一下，这个项目名是否已经被占用了。（如果这个名字已经被占用了，则你是无法向npm上上传的）。

检查方式


npm view 包名
# 这个命令用来查看 某个包的信息
# 如果返回404，说明这个项目名在npm官网上找不到，此时你就可以使用。
# 否则，说明不可用。

很确定地告诉你，myNpm这个包已经被别人占用了，你需要去自己用另一个名字哈。

npm init --yes

命令来创建一个package.json文件，对你项目myNpm信息进行设置。

完成功能开发

image.png 正常开发，完成你的代码。在默认情况下，index.js是这个项目的入口文件。

切换当前npm镜像源到官网

由于我们需要把包上传到npm上，所以要先确保当前的npm源是npmjs.org。与之相关的命令有如下两条。

（1）查看当前的npm的registry配置.


npm config get registry 
# 查看当前的npm的registry配置，确保是https://registry.npmjs.org
​
# 如果不是，可以通过如下命令来设置
npm config set registry https://registry.npmjs.org 
# 手动设置registry

（2）或者使用nrm工具来设置： 如下图所示

image.png

连接npm

npm adduser

这个命令需要输入三个信息以供连接上npmjs：

  • 用户名
  • 密码
  • 邮箱（是你在npmjs官网上注册时使用的信息）

如果你已经不是第一次连接了，这一步是可以省略的。

image.png 你也可以通过如下命令检查自己是否连接成功了。


npm who am i

如果成功了，则可以进行最后一步了：publish

如果想退出:


npm logout

把包上传到npm

npm publish 如果成功：

npm notice npm notice package: tool61@1.0.0 npm notice === Tarball Contents === npm notice 1.3kB index.js npm notice 220B package.json npm notice === Tarball Details === npm notice name: tool61 npm notice version: 1.0.0 npm notice package size: 855 B npm notice unpacked size: 1.5 kB npm notice shasum: 3bfba7bc92e242810a850ac39ded7ebe992a6d9c npm notice integrity: sha512-VoRuxxbcGzXen[...]v3tKWYUT1B1AQ== npm notice total files: 2 npm notice

  • tool61@1.0.0

出错的可能是：

  • 这个包名被别人先用了。
  • 包的版本号不对：每次publish时，包的版本号都应该要大于之前的版本号。
  • 文件过大。你可能需要创建.npmignore文件来设置在打包时要忽略哪些文件。如下是一个demo.

# .npmignore
/node_modules
npm-debug.log
/src
/examples
/build

如果没有报错，则表示一切ok，你可以用你的帐号密码登陆npm，去查看你名下的package是否有了myNpm

下载使用

通过npm install 包名即可来安装包。 然后，告诉你的小伙伴们去下载使用吧。

删除包


npm unpublish --force //强制删除

如果你的包没有什么用处，建议删除掉，以节约公共资源。

更新包

  1. 修改代码，保存。
  2. 更新版本号。可直接在package.json中修改：只能改大，不能改小。
  3. 重新publish

包是什么格式？

格式：

  • 一定要有 package.json这个文件。 它就是用来对包进行整体说明。（name, version, description, author, dependencies, ......）. npm init --yes
  • 有自己的代码文件。这个代码文件要在package.json中的main中声明。

image.png

在上传到npm之前，我们需要切换镜像吗？

需要，我们必须要把代码上传到npm的官网。虽然我们上传是传到npm官网，但是，它会自动同步(例如：每隔15分钟就会通过其它镜像最新的包的信息)给其它的镜像 --- taobao, cnpm.....

在上传时，需要登陆吗？

需要，在命令行中登陆。 npm adduser 这一个操作只需要做一次

在上传时，对包名有约定吗？

有。 1. 不能与现有包重名；2. 包名只能是小写字母+数字+中划线

上传的命令是什么？

是 npm publish

上传出错的可能性有？

  1. 你的帐号还没有通过验证 （在你登记的邮箱里，会收到一封邮件，要去点击确认）。 qq邮箱好像不支持在手机中操作， 建议在pc中浏览器里进行操作。
  2. 没有登陆， 没有做npm adduser
  3. 网络环境不好

如何对包进行版本更新？

  1. 更新代码，准备重新发布
  2. 升级版本号（只能改大，不能改小）。 在 package.json中去修改version值
  3. npm publish

如何去下载包

命令：npm i 包名

  1. 在另一个项目中去下载包
  2. 为了提升下载速度，我们会切换镜像到taobao。
avatar
文章
阅读
粉丝