阅读 77

npm的食用教程

npm的食用教程

今天,大多数开发者都会使用npm来构建JS项目、管理Node的第三方模块(包)。从npm的官网数据来看,总计约有150w的包,周下载量突破300亿,这说明整个npm的生态非常繁荣。作为一名前端开发人员,在学习nodejs的过程中,使用npm是必不可少的技能。
本文将总结在前端开发中npm的知识点,并制作一个简单的包然后发布,帮助大家更好的学习应用。

npm 下载使用包

初始化

在项目所在的根目录下运行 cmd ,输入命令

npm init --yes 复制代码

npm 模块安装

  1. 发出npm install命令

  2. npm向 registry 查询模块压缩包的网址

  3. 下载压缩包,存放在~/.npm目录

  4. 解压压缩包到当前项目的node_modules目录

执行npm install命令后,会生成一个package-lock.json文件,包括以下信息:

  • version:版本号

  • resolved:安装源

  • integrity:验证包是否可用

  • dev:如果为true,则此依赖关系仅是顶级模块的开发依赖关系或者是一个的传递依赖关系

  • requires:依赖包所需要的所有依赖项,对应依赖包package.json里dependencies中的依赖项

  • dependencies:依赖包node_modules中依赖的包,与顶层的dependencies一样的结构

{   "name": "demo",   "version": "1.0.0",   "lockfileVersion": 1,   "requires": true,   "dependencies": {     "packagepop": {       "version": "1.0.0",       "resolved": "https://registry.npmjs.org/packagepop/-/packagepop-1.0.0.tgz",       "integrity": "sha512-nwbmgQuG8XU6Jn+fJlq8aS63+AJp9o6gC/0Ya/wCx0dIX0p/K7RI8c3g==",       "dev": true,       "requires": {},       "dependencies": {}     }   } } 复制代码

引入模块然后使用

下载好包后就可以进行引入使用

const *** = require('***') 复制代码

基础简单的命令

安装:npm install npm i
测试:npm test npm t
帮助:npm --help npm -h 全局:global -g
保存为开发依赖包:save-dev -D 初始化:npm init npm init --yesnpm init --force npm init -ynpm init -f
搜索:npm search
查看当前项目安装的模块:npm ls
查看全局安装的所有模块:npm ls -g --depth 0
模块卸载:npm uninstall lodash
模块更新:npm update npm update lodash
引用模块:npm link

整一个自己的npm包

检查是不是官方源

由于我们需要把包上传到npm上,所以要先确保当前的npm源是npmjs.org

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

连接npm /在本地登录自己的npm账户

本地打开命令行使用命令npm login/npm adduser然后输入信息。
npm who am i命令检查时候连接成功。
npm logout命令退出账户。

初始化.jpg

创建包所需的文件

上面已经把准备工作做完了,现在我们要开始真正的创建自己的包了。

  1. 使用npm init创建package.json文件,根据提示自行输入相应数据

name:包名,不能与npm官网上已有的包重名,可以用npm view 包名检查,404则说明官网找不到可以使用
version:包的版本,初始是1.0.0
description:描述你这个包
entry point:默认为index.js,是包的入口文件,可以自定义
test command:测试命令,可以不填直接回车
git repository:git仓库地址,也可以回车不填
keyword:包的关键字,可以填相关的技术栈
author:作者的名字 license:开源类型,直接回车就行
Is this ok? yes

npm init.jpg 2. 创建包的文件

  • lib目录- - - - -用来装包的主要方法文件

  • lib目录下新建randomCall.js- - -包的具体方法

  • index.js - - - -入口文件

  • README.md - - - - -包的说明md文件

主要文件.jpg

完成这个包

创建好文件结构后就可以开始写包的主要方法了。
下面是我这个包的简单示例 ↓

// randomCall.js function randomCall(arr) {   const index = parseInt(Math.random() * arr.length);   return arr[index]; } module.exports = {   randomCall, }; 复制代码

// index.js const random = require("./lib/randomCall.js"); module.exports = {   ...random, }; 复制代码

这里的功能代码就是简单实现从数组中随机取值,然后通过module.exports暴露出去,外面的入口文件再获取一次、暴露一次即可。
可以再写一个test.js文件测试一下功能。

// test.js const random = require("./random_call"); const arr = ["1", "2", "3", "4", "5", "6", "7"]; const randomCall = random.randomCall(arr); console.log(randomCall); // node test.js 运行可以得到 arr 中的随机值 复制代码

发布自己的包

测试自己的包功能完成后就可以发布这个包了,后续功能更新只需要更新版本就可以了。现在我们把它发布出去。
使用命令npm publish

发布失败

发布失败.jpg 第一次发布就失败了,看看是什么问题,提示信息应该是用了镜像源发布的原因,发布包一定要用官方的:
registry.npmjs.org
更换发布源之后再发布一次。
使用命令npm config set registry https://registry.npmjs.org

大家也可以使用nrm工具来快速切换,这里先不介绍了。

发布成功.jpg 再发布一次就发布成功了,登录 npm 官网可以进行一个查看,同时填写的邮箱也会收到一个发布成功的提示邮件。

收到邮件.jpg

总结和后续

发布出错的可能是:

不是registry.npmjs.org官方源
包跟别的已发布的包重名了
包的版本号不对,每次publish时,包的版本号都应该要大于之前的版本号
文件过大,可能需要创建.npmignore文件来设置在打包时要忽略哪些文件

删除包

npm unpublish --force //强制删除 复制代码

更新包

修改代码,保存
更新版本号。可直接在package.json中修改:只能改大,不能改小
重新 publish 即可更新包


作者:PumbaaPoP
链接:https://juejin.cn/post/7018532152467783687


文章分类
后端
文章标签
版权声明:本站是系统测试站点,无实际运营。本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 XXXXXXo@163.com 举报,一经查实,本站将立刻删除。
相关推荐