npm包【详解】(内含npm包的开发、发布、安装、更新、搜索、卸载、查看、版本号更新规则、package.json详解等)

简介: npm包【详解】(内含npm包的开发、发布、安装、更新、搜索、卸载、查看、版本号更新规则、package.json详解等)

npm 包

npm 包即符合 npm官网 规范的 js 模块,通常会发布到 npm 官网中,供大家下载使用。

npm 包的详细信息

npm 包的详细信息储存在 npm 包的 package.json 文件中,通常包含以下信息:

  • name - 包名。
  • version - 包的版本号。
  • description - 包的描述。
  • homepage - 包的官网 url 。
  • author - 包的作者姓名。
  • contributors - 包的其他贡献者姓名。
  • dependencies - 依赖包列表。如果依赖包没有安装,npm 会自动将依赖包安装在 node_module 目录下。
  • repository - 包代码存放的地方的类型,可以是 git 或 svn,git 可在 Github 上。
  • main - main 字段指定了程序的主入口文件,require(‘moduleName’) 就会加载这个文件。这个字段的默认值是模块根目录下面的 index.js。
  • keywords - 关键字

npm 包的版本号

npm 包的版本号分为X.Y.Z三位,分别代表主版本号、次版本号和补丁版本号。

当代码变更时,版本号按以下原则更新:

  • 只是修复bug,需要更新Z位。
  • 新增了功能,但是向下兼容,需要更新Y位。
  • 有大变动,向下不兼容,需要更新X位。

查看指定包的版本号

grunt 为包名

npm list grunt

安装包 npm install

express 为依赖包的名称,npm install 可简写为 npm i

本地安装

将安装包下载到 ./node_modules 中(运行 npm 命令时所在的目录),若没有 node_modules 目录则会创建该目录

npm install express

使用时,无需指定第三方包路径。

var express = require('express');

全局安装

会将包下载到node.js的安装目录中的 node_modules 目录中,所有项目都可以使用全局安装的包

npm install express -g

更新包 npm update

express 为依赖包的名称

npm update express

搜索包 npm search

express 为依赖包的名称

npm search express

卸载包 npm uninstall

express 为依赖包的名称

npm uninstall express

查看当前目录下的所有包

npm ls

查看全局安装的所有包

npm list -g

开发 npm 包

  1. 新建文件夹 mypack-test
  2. 用vscode 打开文件夹 mypack-test
  3. 终端执行 npm init 生成 package.json 文件,一路回车,最后输入 y 回车即可。
  1. 蓝框内的部分为包的信息,可根据需要自行输入(或等生成package.json后再修改)
  • package name 包名,默认为项目名称
  • version 包的版本号,默认为 1.0.0
  • description 包的描述信息
  • entry point 包的入口文件(包内的所有内容,要在此文件对外导出),默认为 index.js
  • test command 测试命令,默认为 “echo “Error: no test specified” && exit 1”
  • git repository 包的远程 git 仓库
  • keywords 关键字
  • author 包的作者
  • license 开源文件协议,默认为 ISC
  1. 新建文件index.js,内容为
    要点:定义的函数/变量一定要对外导出!
/*
  函数功能——求和
  参数——两个数字
*/
function sum(a, b) {
  return a + b;
}

module.exports = {
  sum: sum,
};

至此,已完成 npm 包的开发,若想对外开放下载,请继续发布 npm 包

发布 npm 包

  1. 注册 npm 账号
npm adduser

或者直接去官网注册 https://www.npmjs.com/

  1. 登录 npm 账号
npm login

按提示依次输入npm 的账号、密码、邮箱、邮件中收到的一次性校验码

3. 发布

npm publish

若遇到以下报错

npm ERR! code E403
npm ERR! 403 403 Forbidden - PUT https://registry.npmjs.org/mypack-test - You do not have permission to publish "mypack-test". Are you logged in as the correct user?

则说明 npm 官网已存在当前包。

解决方案

将 package.json 中的包名 name 修改为一个 npm 官网不存在的包名,再发布即可。

如最终我的包名为 mypack-test-999

发布成功后,在官网即可查到

https://www.npmjs.com/package/mypack-test-999

试用原创的 npm 包

  1. 新建文件夹 test_mypack
  2. 用 vscode 打开文件夹 test_mypack
  3. 安装包
npm i mypack-test-999

4. 新建文件 index.js,内容为

import { sum } from "mypack-test-999";

let result = sum(6, 2);
console.log(result);

  1. 执行 index.js

    出现图中的报错,则需要在 package.json 中添加
"type": "module",

再次执行 index.js,得到预期结果,验证成功!

 

目录
相关文章
|
3月前
|
JavaScript 前端开发 Java
npm学习一:npm 包管理工具 学习、使用。
这篇文章介绍了npm的基础知识和常用命令,包括安装包、查看包信息、管理依赖等操作,并提供了如何删除npm安装的镜像以及如何彻底删除node_modules文件夹的具体步骤。
112 2
|
3月前
|
JavaScript 前端开发 Java
npm学习一:npm 包管理工具 学习、使用。
这篇文章是关于npm包管理工具的学习、使用指南,包括npm概述、基础命令和如何安装webpack。
88 3
npm学习一:npm 包管理工具 学习、使用。
|
3月前
|
JSON API 数据安全/隐私保护
拍立淘按图搜索json数据格式示例(API接口)
拍立淘按图搜索API接口为电商平台和购物应用提供了强大的图像搜索功能,能够显著提升用户的购物体验和搜索效率。开发者可以根据自己的需求调用此接口,并处理返回的JSON格式数据来展示推荐商品
|
3月前
|
资源调度 前端开发 安全
前端实战:基于Verdaccio搭建私有npm仓库,轻松上传与下载自定义npm插件包
前端实战:基于Verdaccio搭建私有npm仓库,轻松上传与下载自定义npm插件包
158 0
|
4月前
|
数据安全/隐私保护
发布一个npm包
发布一个npm包
130 2
|
5月前
|
资源调度 JavaScript 索引
Vue2开发插件并发布到npm
这篇文章介绍了如何使用Vue 3、TypeScript和Vite开发一个下拉框组件`vue-amazing-selector`,并将其发布到npm,包括了项目的创建、组件开发、配置webpack、编写组件代码、导出组件、编译、npm包初始化、发布流程以及在项目中使用该插件的完整步骤。
Vue2开发插件并发布到npm
|
5月前
|
缓存 前端开发 Linux
哇塞!NPM 缓存竟成开发拦路虎?快来掌握清空秘籍,开启前端开发逆袭之旅!
【8月更文挑战第20天】NPM是前端开发中管理依赖的关键工具。有时需清空其缓存以解决版本不一致或包损坏等问题,确保使用最新依赖。可通过命令`npm cache clean --force`强制清空全部缓存,或手动删除各系统下的缓存文件夹。注意清空缓存可能延长后续安装时间,建议事先备份依赖或确保可重新安装。正确管理缓存有助于提升开发效率。
171 1
|
5月前
|
缓存 JavaScript 前端开发
成功解决:npm 版本不支持node.js。【 npm v9.1.2 does not support Node.js v16.6.0.】
这篇文章介绍了如何解决npm版本与Node.js版本不兼容的问题,提供了查看当前npm和Node.js版本的步骤,以及如何根据Node.js版本选择合适的npm版本并进行升级的详细指导。
成功解决:npm 版本不支持node.js。【 npm v9.1.2 does not support Node.js v16.6.0.】
|
6月前
|
运维 Kubernetes Java
阿里云云效操作报错合集之npm包已经发布到了制品仓库,但流水线中拉取依赖时出现404错误,该如何排查
本合集将整理呈现用户在使用过程中遇到的报错及其对应的解决办法,包括但不限于账户权限设置错误、项目配置不正确、代码提交冲突、构建任务执行失败、测试环境异常、需求流转阻塞等问题。阿里云云效是一站式企业级研发协同和DevOps平台,为企业提供从需求规划、开发、测试、发布到运维、运营的全流程端到端服务和工具支撑,致力于提升企业的研发效能和创新能力。
阿里云云效操作报错合集之npm包已经发布到了制品仓库,但流水线中拉取依赖时出现404错误,该如何排查
|
5月前
NPM——删除已发布的包
NPM——删除已发布的包
159 1

热门文章

最新文章

推荐镜像

更多