写点什么

【Node.js】npm 与包【万字教学~ 超超超详细】

  • 2022-11-22
    河北
  • 本文字数:6177 字

    阅读完需:约 20 分钟

​包        什么是包 Node.js 中的第三方模块又叫做包,指的是同一种东西,知识叫法不同


包的来源不同于 Node.js 的内置模块与自定义模块,包是由第三方个人或团队开发出来的,免费供所有人使用。


注意:Node.js 中的包都是免费且开源的,不需要付费即可免费下载使用。


为什么需要包由于 Node.js 的内置模块仅提供了一些底层的 api,导致在基于内置模块进行项目开发的时候,效率很低,包是基于内置模块封装出来的,提供了更高级,更方便的 api。极大地提高了开发效率。包和内置模块之间的关系,类似于 jquery 和浏览器内置 api 之间的关系。


从哪里下载国外有一家 IT 公司,叫做 npm,lnc。这家公司旗下有一个非常著名的网站,全球最大的包共享平台


你可以从这个网站上搜索到任何你需要的包,只要你有足够的耐心!


到目前为止,全球约有 1100 万左右的开发人员,通过这个包共享平台,开发并共享了超过 120 多万个包供我们使用。


npm,lnc 公司提供了一个地址为https://registry.npmjs.org/服务器,来对外共享所有的包,我们可以从这个服务器上下载自己所需要的包。


如何下载包 npm,lnc 公司提供了一个包管理工具,我么可以使用这个包管理工具,从https://registry.npmjs.org/服务器上吧所需要的包下载到本地使用。


这个包管理工具的名字叫做 Node Package Manager (简称 npm),这个包管理工具随着 Node.js 的安装包一起被安装到了用户的电脑上,


大家可以在终端中 执行 npm -v 命令,来查看自己电脑上所安装的 npm 包管理工具的版本号。


npm 初体验        格式化时间的传统做法                实现步骤创建格式化事件的自定义模块自定格式化时间的方法创建补零函数从自定义模块中导出格式化时间的函数导入格式化时间的自定义模块调用格式化时间的函数                 实现代码自定义时间格式化模块


//定义格式化时间的方法 function dataFormat(data) {//接受字符串创建对象 const dt = new Date(data);//年 const Y = dt.getFullYear();//月 const m = format(dt.getMonth() + 1);//日 const d = format(dt.getDay());//时 const hh = format(dt.getHours());//分 const mm = format(dt.getMinutes());//秒 const ss = format(dt.getSeconds());return ${Y}-${m}-${d} ${hh}:${mm}:${ss};


}//补零操作 function format(data) {return data > 9 ? data : '0' + data;}//暴露对象 module.exports = { dataFormat };


大家注意曝光这里要用 module.exports,因为这里引用了新的对象,或者修改引用对象添加属性,可以使用 exports。


exports.dataFormat = dataFormat;         使用模块


//导入模块 const data = require('./自定义模块/格式化时间模块.js');//创建未格式化对象 let olddata = new Date();console.log(olddata);//调用格式化模块 let newdata = data.dataFormat(olddata)console.log(newdata);


利用包格式化时间                步骤使用 npm 包管理工具,在项目中安装格式化时间的包 moment 使用 require()导入包参考 moment 的官方 api 文档学习了解使用方法                 安装包在当前终端中输入


npm install momentnpm 包管理工具


install  安装 可简写成 i


moment  包名称


下载包之后 可以在上面提到的网站内搜索 moment 查看 api 文档学习使用方法,网站是英文的,也可以在 csdn 内进行搜索一般也可以找到教学文章。


实现代码//导入包 const moment = require('moment');//格式化事件//单词要大写 const newdate = moment().format('YYYY-MM-DD HH:MM:SS');console.log(newdate);        安装包后的相关文件初次安装包完成后,在项目文件夹下会多三个文件,一个叫做 node_modules 的文件夹和 package-lock.json 的配置文件另一个是 package.json。


其中


node_modules 文件夹用来存放所有已安装到项目中的包,require()导入第三方包时,就是从这个目录中查找并加载的包,


package-lock.json 配置文件用来记录 node_modules 目录下的每一个包的下载信息,例如包的名字信息,版本号等。


注意:不需要修改两个文件中的任何东西,npm 包会自动维护。


安装指定版本的包默认情况下,使用 npm i 命令安装包的时候,会自动安装最新版本的包。如果需要安装指定版本的包,可以在包名之后,通过 @符号指定具体的版本。


npm i moment @ 1.1.12        包的语义化版本规范包的版本号是以‘点分十进制’形式进行定义的,总共有三位数字,例如:2.24.0


期中没一位数字所代表的含义如下


第一位数字:大版本


第二位数字:功能版本


第三位数字:bug 修复版本


版本号提升的规则:只要前面的版本号增长了,则后面的版本号归零。


npm 与包        包管理配置文件 npm 规定,在项目跟目录中,必须提供一个叫做 package.json 的包管理配置文件,用来记录与项目有关的一些配置信息,例如:


项目的名称,版本号概述等项目中都用到了哪些包哪些包只在开发期间会用到哪些包在开发和部署时都需要用到                多人协作的问题


如何记录项目中安装了哪些包在项目根目录中,创建一个叫做 package.json 的配置文件,即可用来记录项目中安装了哪些包,从而方便剔除 node_modules 目录之后,在团队成员之间共享代码。


注意:今后在项目开发中,一定要把 node_modules 文件夹,添加到 gitignore 忽略文件中


快速创建 package.jsonnpm 包管理工具提供了一个快捷命令,可以在执行命令时所处的目录中,快速创建 package.json 这个包管理配置文件,在我们安装第三方包的时候 如果没有 package.json 也会自动生成一个(里面只有安装的包的信息)。


npm init -y 注意:上述命令只能在英文的目录下成功运行,所以需要保证项目文件所处的父级目录要是英文名。


建议 建立文件夹后 就执行此命令先创建一个 package.son。


安装包的时候  会自动将相关信息写入 package.json 文件中。


dependdencies 节点 package.json 文件中,有一个 dependencies 节点,专门用来记录您使用 npm i 命令安装了哪些包


一次性安装的所有的包 当我们拿到一个提出了 node_modules 的项目之后,启动项目会报错,提示没有所需要的包,苏一在启动项目之前。我们应该安装所有需要的包,package.jaon 中记录的包,然后才能运行起来。


npm install 我们只需要执行这个命令,执行这个命令后,会读取 package.json 中所有以来的包,并下载。


卸载包 npm uninstall 包名这个是不能简写的,卸载之后 也会将包名从 package.json 文件中删除,


devDependencies 节点如果某些包只在项目开发阶段会用到,在项目上线之后不会用到,则建议把这些包记录到 devDependencies 节点中,


如果某些包在开发和项目上线都需要用到,则建议把这些包记录到 dependencies 节点中。


npm install 包名 -D 只需要在结尾加个-D 就可以将包安装在 devDependencies 中


解决下包速度慢问题                为什么下包速度慢在使用 npm 下包的时候,默认从国外的https://registry.npmjs.org/服务器进行下载,此时,网络数据的传输需要经过漫长的海底光缆,因此下包速度回很慢。


淘宝 NPM 镜像服务器淘宝在国内搭建了一个服务器,专门把国外服务器的包同步到国内的服务器,然后我们可以再从国内的服务器上下载包,这样就可以大大提高包的下载速度。


镜像:是一种文件存储形式,一个磁盘上的数据在另一个磁盘上存在一个完全相同的副本即为镜像。


切换 npm 的下包镜像源查看当前下包的服务器地址


npm config get registry


切换淘宝服务器


npm config set registry=https://registry:npm:taobao.org/


nrm 为了更方便的切换下包的镜像包,我们可以安装 nrm 这个小工具,利用 nrm 提供的终端命令,可以快速查看和切换下包的镜像源。


npm i nrm -g-g 全局下载,


查看所有可用的镜像源


nrm ls


nrm use taobao          包的分类                项目包那些被安装到项目的 node_modules 目录中的包,都是项目包。


项目包分为两类,分别是:


开发依赖包(被记录到 devDependendes 节点中的包,只在开发期间使用)核心依赖包(被记录到 dependencies 节点中的包,在开发期间和项目上线之后都会用到)                 全局包在执行 npm install 命令时,如果提供-g 参数,则会把包安装为全局包。


全局包安装包查看位置命令


npm config ls


注意: 只有工具性质的包 才有全局安装的必要性。


i5ting_toc 作为程序员,md 文档的编写往往是必要的,md 文档编写简易快捷,是不二的笔记语言。


这是一个可以把 md 文档转为 html 页面的小工具,这种工具性质的包 就是有必要全卷装的,便于我们日后使用。


安装


npm i  i5ting_toc -g 使用


i5ting_toc -f 文件路径 -o        规范的包结构在清楚了包的概念,以及如何下载和使用包之后,接下来我们深入了解一下包的内部结构


一个规范的包,它的组成结构,必须符合以下三点要求


包必须以单独的目录而存在包的顶级目录下要必须包含 package.json 这个配置文件 package.json 中必须包含 name,version,main 这三个属性,分别代表包的名字,版本号,包的入口。        开发属于自己的包                需要实现的功能格式化日期转义 HTML 中的特殊字符还原 HTML 中的特殊字符                 初始化包的基本结构新建 itheima-tools 文件夹,作为包的根目录在 itheima-tools 文件夹中,新建如下三个文件 package.json  包管理配置文件 index.js 包入口文件 README.md  包的说明文档                  初始化 package.json{"name": "itheima-tools-xiepu","version": "1.0.0","main": "index.js","description": "提供了格式化时间。转义功能","keywords": ["xiepu","tools","format"],"license": "ISC"}name  制作的 npm 包的名称  之后导入包 搜索包 都是这个名字 这个名字不可重复 建议命名之前现在 npm 网站内搜索一下是否重名 version 版本号 main 主文件路径 到我们使用导入这个包的时候。就会自动执行这个 js 里面的内容 description  这是对包的描述 keywords  包的关键字 在网站内搜索时的关键字 license 遵循的开源许可协议                 在 index.js 中定义格式化时间的方法可以直接粘贴我们之前写的自定义包函数


//定义格式化时间的方法 function dataFormat(data) {//接受字符串创建对象 const dt = new Date(data);//年 const Y = dt.getFullYear();//月 const m = format(dt.getMonth() + 1);//日 const d = format(dt.getDay());//时 const hh = format(dt.getHours());//分 const mm = format(dt.getMinutes());//秒 const ss = format(dt.getSeconds());return ${Y}-${m}-${d} ${hh}:${mm}:${ss};


}//补零操作 function format(data) {return data > 9 ? data : '0' + data;}//暴露对象 exports.dataFormat = dataFormat;                在 index.js 中定义转义 html 的方法//定义转义字符函数 function htmlstr(hstr) {return hstr.replace(/<|>|"|&/g, data => {switch (data) {case '<':


            return '&lt;';
case '>': return '&gt;'; case '"': return '&quot;'; case '&': return '&amp;'; }})
复制代码


}//暴露对象 exports.htmlstr = htmlstr;


在 index.js 中定义还原 HTML 的方法 function htmlstr1(hstr) {return hstr.replace(/<|>|"|&/g, data => {switch (data) {case '<':


            return '<';
case '&gt;': return '>'; case '&quot;': return '"'; case '&amp;': return '&'; }})
复制代码


}//暴露对象 exports.htmlstr1 = htmlstr1;                将不同的功能进行模块化拆分将格式化时间的功能,拆分到 src dataFormat.js 中将处理 html 字符串的功能,拆分到 src htmlstr.js 中在 index.js 中,导入两个模块,得到需要向外共享的方法在 index.js 中,使用 module.exports 把对应的方法共享出去 将格式化时间,和字符串转义各自分别放到独立的 js 中(创立一个 src 文件夹),并进行暴露。


然后在主页 index.js 中,进行导入和曝光。


const htmlstr = require('./src/htmlstr');const dataFormat = require('./src/dataFormat');


module.exports = {htmlstr,dataFormat}


调用测试


const itheima = require('../itheima-tools');


console.log(itheima.dataFormat.dataFormat(new Date()));const str = '<h1>232</h1>';console.log(itheima.htmlstr.htmlstr(str));console.log(itheima.htmlstr.htmlstr1(str));


详细说一下这里,我们首先调用的 index.js 这个模块,可以看到导入只写了文件夹没写 index.js,这种写法同样也可以导入 index.js,它会去寻找 package.json 里的 main 属性,所以会导入 index.js,导入 index.js 之后,我们又从 index.js 中导入了另外两个转义和格式化时间模块,所以在使用属性时


是这样一个过程 itheima 这个模块里的 htmlstr 模块里的 htmlstr 属性。


那么可不可以不写的那么复杂?


答案是可以的  我们只要在 itheima 这个模块里 直接曝光出所有属性就好,这里我们可以在 itheima 模块中使用 es6 的展开属性...直接将相关内容曝光在对象内。


index.js


const htmlstr = require('./src/htmlstr');const dataFormat = require('./src/dataFormat');


module.exports = {...htmlstr,...dataFormat}


ceshi.js


const itheima = require('../itheima-tools');


console.log(itheima.dataFormat(new Date()));const str = '<h1>232</h1>';console.log(itheima.htmlstr(str));console.log(itheima.htmlstr1(str));


编写包的说明文档说明文档内容没有强制性要求,只要能清晰的包的作用,注意点写好就可以,书写内容大致有以下六点


安装方式导入方式格式化时间转义 html 中的特殊字符还原 html 中的特殊字符开源协议 大家可以去学习一下 markdown 文档编写的语法 并不难

安装

npm install itheima-tools-xiaoxie
复制代码

导入

const name = require ('itheima-tools-xiaoxie')
复制代码

格式化时间

console.log(itheima.dataFormat(new Date()));
复制代码

转义 html 字符

const str = '<h1>232</h1>';这里输入内容console.log(itheima.htmlstr(str));
复制代码

还原 html 字符

const str = '<h1>232</h1>';这里输入内容console.log(itheima.htmlstr1(str));
复制代码


文件里 有ceshi.js文件 可以在里面进行测试
复制代码

开源协议

ISC
复制代码


发布包                注册 npm 账号登录 npm 网站,点击 sign up 按钮,进入注册用户界面填写账户相关的信息,Full Name , Public Email,  Username,  Password 点击 Create an Account 按钮,注册账号                在终端登录 npm 账号 npm 账号注册完成后,可以在终端中执行 npm login 命令,依次输入用户名,密码,邮箱后,即可登录成功。


注意:在登录 npm 包,发布包之前要将下载地址修改为 npm 官网地址,否则发布包会失败。


nrm use npm 登录


根据提示依次输入账号 密码 邮箱 验证码


会显示已登录 后面显示网站名称


可以看到 我们登录到了官网上面


把包发布到 npm 上将终端切换到 包的根目录 运行 npm publish 命令,就可以将包发不到 npm 上(注意 包不可以重名)


发布成功


打开网站  将账号登入 鼠标移动到头像  点击 packages  就可以看到我们发布的内容


删除已发布的包运行 这个命令就可以将 npm 上面的包删除掉


npm unpublish 包名--force 注意:通过此命令只可以删除发布 72 小时内的包


删除的包 24 小时内不可以重复发布


用户头像

还未添加个人签名 2022-10-14 加入

还未添加个人简介

评论

发布
暂无评论
【Node.js】npm与包【万字教学~超超超详细】_node.js_坚毅的小解同志_InfoQ写作社区