一文学会npm介绍、安装、使用、常用指令、发布自己的npm包

通过npm login 指令输入你刚刚注册的账号和密码登录,登录成功后,可通过npm whoami 来查看登录信息;输入npm publish –access public 将你的包提交到npm平台上;静候佳音,如果一切顺利,过几分钟后就可以在npm上看到你发布的包了,你也可以通过npm搜索你的包,如果能搜索到,表示已经发布成功

一、npm介绍+安装

昨天安装的Nodejs相当于是一款裸机。

npm相当于是应用市场。是Nodejs的包管理器(Nodejs package manage)

包: 即为模块。在Nodejs中一切皆模块。

01.npm平台上传下载包示意图

常见的使用场景有以下几种:

允许用户从NPM服务器下载别人编写的第三方包到本地使用。
允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。

web前端开发的两种环境:

  1. 浏览器环境-传统前端
  2. Nodejs环境-现代前端

npm官方文档:http://npmjs.org/

npm中文文档:https://www.npmjs.com.cn/

二、你怎么知道有哪些包呢?

  1. 口口相传
  2. npm搜索
  3. 百度搜索
  4. 到你知道的插件、框架的官网看他是否有提供npm包

三、学习一些常用的npm指令

npm help <command> 查看某条指令的详细用法
npm -v 查看npm版本
npm list -g 列出所有的通过npm安装的包
npm list express -g 查看全局的指定的安装包的版本信息
npm list express 查看局部的安装包信息(命令行在哪里运行就在哪里查看)
npm install 安装包 -g 在全局安装包,去掉-g则在当前目录安装
npm install npm -g  更新升级npm
建议通过淘宝的镜像cnpm install npm -g升级或使用npm
npm uninstal express(模块名)  卸载该模块 
npm ls  卸载后查看该模块是否还在
npm update express(模块名)  更新模块
npm search express(模块名) 搜索模块
npm update <package> 更新当前目录下的对应模块
npm update -g npm  更新升级npm

四、使用淘宝 NPM 镜像

npm速度在国内较慢,可以切换为国内的淘宝镜像版本,该镜像版本每隔10分钟会同步一次全球的npm包。

在命令行工具中输入如下指令($不用输,表示它是命令行):

$ npm config set registry https://registry.npmmirror.com

这样就换成了国内镜像地址,再使用npm指令就会非常快了。

五、当做买家,使用npm小试牛刀安装uglify-js压缩工具用一用

  1. 安装该工具

    cnpm install uglify-js -g
    //-g 表示全局安装,意思是可以在任意目录下都可以使用该工具
    //如果不添加-g,则表示只能在当前目录下使用
  2. 使用

    到npm官网搜索该包,会有详细的使用说明:https://www.npmjs.com/package/uglify-js

六、当做卖家,发布一个npm包上去给分享给其他人下载

  1. 发布规范,添加一个描述文件,package.json

    在本地电脑新建一个空一个文件夹当做依赖包根目录,然后在命令行中输入:

    npm init    #引导你一步步生成
    # 或
    npm init -y #一键生成

    生成的文件内容如下:

    {
     "name": "imqdcn",
     "version": "1.0.1",
     "description": "前端老罗发布的包",
     "main": "main.js",
     "scripts": {
       "test": "echo \"Error: no test specified\" && exit 1"
     },
     "keywords": [
       "imqdcn",
       "map",
       "压缩"
     ],
     "author": "前端老罗发布的包",
     "license": "ISC"
    }
    
  2. 准备依赖包文件

    在刚刚的文件夹下只有一个package.json文件,接下来放你要发布的文件(包的内容)。

    至于要放什么,完全是自己说了算,npm不会审核,但是如果你没有按规范来开发依赖包,比如JQ,BS,vue都在npm中能看到,那么别人就使用不了,相当于是垃圾包了。

    npm依赖包文件

  3. 发布指令

    1、首先需要注册一个npm账号:https://www.npmjs.com
       2、在本地某个文件夹下使用命令:npm init  该命令其实就是用来引导你构建package.json文件的,文件夹名字应该就是你的包名
       3、在该目录下新建你想要提交的文件,比如index.js等
       4、写好readme.md,就像github的readme.js那样,描述你的包是干什么的,怎么用的
    2-4在前面已经完成,接下来是重点:
       5、通过npm login 指令输入你刚刚注册的账号和密码登录,登录成功后,可通过npm whoami 来查看登录信息
       6、输入npm publish --access public 将你的包提交到npm平台上
       7、静候佳音,如果一切顺利,过几分钟后就可以在npm上看到你发布的包了,你也可以通过npm搜索你的包,如果能搜索到,表示已经发布成功
    

    npm publish成功图

    刚刚发布的包地址如下:https://www.npmjs.com/package/imqdcn

    你可以打开看看。

    注意:如果修改了包名,需要再次发布更新到线上时,一定要改变下版本号

笔记案例下载:

此资源下载链接已被无情的隐藏,请输入验证码解锁:
验证码

请关注本站公众号回复“验证码”,获取验证码。

在微信里搜索“WEB前端全栈圈”或者“imqdcn”或者微信扫描二维码都可以关注微信公众号

WEB前端全栈圈
除特别声明外, 本站所有内容皆为原创,未经许可,禁止转载。转载时请务必以超链接形式标明文章出处和作者信息
  • 996
(0)
打赏 微信扫一扫 微信扫一扫
                       

关于作者:

web前端老罗

贡献:已经在WEB前端圈发表90篇文章了

简介:前端老罗是一位拥有多年web前端开发经验、管理经验、教学经验的实战派全栈工程师。目前在某名企任职WEB前端技术教官。加我微信:imqdcnn可提供开发、技术咨询、答疑、直播讲座等服务

Ta的专栏 | Ta的站点 | 其他SNS

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关于WEB前端圈

我是前端人(imqd.cn)愿景是不管你是想学习前端还是一名专业的WEB前端工程师在这里都能找到你想要的物料。定位为前端人学习进步的一个平台。在这里你能找到前端学习笔记、教学视频资源、案例、前后端分离、前端框架、低代码平台、可视化数据、多端开发、全栈开发等跟前端有关的一切资源!

关于站长:WEB前端老罗(罗老师)是一位拥有多年web前端开发经验、管理经验、IT培训教学经验的实战派全栈工程师。目前在某名企任职WEB前端技术教官。右边加我微信可提供开发、技术咨询、答疑、直播讲座等服务

WEB前端圈二维码

右边添加老罗微信一对一免费私聊
拉你加入官方微信答疑群

To top