图文详解如何开发一个自己的包并发布到npm

 更新时间:2025年10月28日 10:18:15   作者:impossible1994727  
前端开发将自己编写的常用组件、工具模块、指令,常用api库、框架等代码,为了能够更好、更灵活的管理这些代码,上传到npm库是一个非常好的选择方式,这篇文章主要介绍了如何开发一个自己的包并发布到npm的相关资料,需要的朋友可以参考下

注册npm账号

点击 npm官网 注册自己的账号

构建一个自己的包

本地新建一个文件夹

文件夹内新建三个文件,index.js,package.json,README.md

  • index.js:写分享出去的对象。
  • package.json:写name:包的名字(必须),version:版本号,main:包的入口文件,以及其他相关配置信息。

注意:package.json中的name在npm官网上搜一下,必须具有唯一性

比如

README.md:说明文档,没有特殊要求

下面举一个例子,构建一个将一个数据转换为万元为单位的包

包的结构如下:

index.js内容如下:

const thousand=require('./dist/thousand');
module.exports={
    ...thousand
}

dist/thousand.js内容如下:

 const formatAsTenThousand = number => {
    if (!number) return "";
    return (number / 10000).toFixed(1);
  };
  exports.formatAsTenThousand=formatAsTenThousand

package.json内容如下:

{
    "name": "thousand_tools",
    "version": "1.0.0",
    "main": "index.js",
    "description": "将一个数据转换为万元为单位",
    "keywords": [
        "thousand",
        "escape"
    ],
    "license": "ISC",
    "dependencies": {
        "thousand_tools": "^1.0.0"
    }
}

README.md内容自己看着写

登录npm账号

确认本地终端为npm

在登录之前,要确认本地的镜像源为npm官方服务器,否则会导致发布失败。在终端输入:

npm config get registry

上图看出本地终端是淘宝镜像,所以要切换当前镜像为npm

切换npm镜像

两种方式

1、nrm 镜像源管理

终端输入npm i nrm -g,全局安装nrm

npm i nrm -g

安装完成后,在本地终端输入nrm ls,查看可用的镜像源

nrm ls

上图表示,当前镜像源为npm

第一次上传包之前,终端输入 nrm use npm,确保切换镜像源为npm

nrm use npm

nrm use 镜像源名称,表示切换为当前镜像源。比如nrm use yan,nrm use taobao等

2、命令行直接切换

终端直接输入npm config set 镜像源地址进行切换

npm config set https://registry.npmjs.org/

终端登录npm

终端输入npm login

npm login

按照提示输入账号,密码

登录完成之后,可以终端输入 npm whoami确定是否登录成功

npm whoami

发布包到npm

按照上面步骤,登录成功之后,切换到要发布的包的根目录,终端输入npm publish

npm publish

然后回到npm官网

看到上图,thousand_tools包即发布成功。

删除包

终端输入

npm unpublish thousand_tools --force

npm unpublish 包名 --force,即可从 npm 删除已发布的包。

比如删除上面thousand_tools包

注意:

 npm unpublish 命令只能删除 72 小时以内发布的包

npm unpublish 删除的包,在 24 小时内不允许重复发布

总结

到此这篇关于如何开发一个自己的包并发布到npm的文章就介绍到这了,更多相关开发包并发布到npm内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Nodejs实现获取实时数据的三种主流方式详解

    Nodejs实现获取实时数据的三种主流方式详解

    这篇文章主要为大家详细介绍了Nodejs前端获取实时数据的三种主流方式,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-02-02
  • node+vue实现文件上传功能

    node+vue实现文件上传功能

    这篇文章主要介绍了node+vue实现文件上传功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-05-05
  • node.js中express-session配置项详解

    node.js中express-session配置项详解

    本篇文章主要介绍了node.js中express-session配置项详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-05-05
  • Windows下快速搭建NodeJS本地服务器的步骤

    Windows下快速搭建NodeJS本地服务器的步骤

    本篇文章主要介绍了Windows下快速搭建NodeJS本地服务器的步骤,具有一定的参考价值,感兴趣的小伙伴们可以参考一下。
    2017-08-08
  • Nodejs异步流程框架async的方法

    Nodejs异步流程框架async的方法

    这篇文章主要介绍了Nodejs异步流程框架async的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-06-06
  • nodejs操作mongodb的增删改查功能实例

    nodejs操作mongodb的增删改查功能实例

    这篇文章主要介绍了nodejs操作mongodb的增删改查功能,简单分析了mongodb模块的安装并结合实例形式分析了nodejs操作mongodb数据库进行增删改查的相关实现技巧,需要的朋友可以参考下
    2017-11-11
  • NPM命令运行报错:npm v10.2.4 is known not to run on Node.js v14.21.1解决办法

    NPM命令运行报错:npm v10.2.4 is known not to run on Node.js

    这篇文章主要给大家介绍了关于NPM命令运行报错:npm v10.2.4 is known not to run on Node.js v14.21.1的解决办法,文中将解决办法介绍的非常详细,需要的朋友可以参考下
    2024-01-01
  • Nodejs封装类似express框架的路由实例详解

    Nodejs封装类似express框架的路由实例详解

    在本篇文章里小编给大家整理的是关于Nodejs封装类似express框架的路由实例内容,有需要的朋友们学习下。
    2020-01-01
  • Node.js调试技术总结分享

    Node.js调试技术总结分享

    Node.js是一个可以快速构建网络服务及应用的平台。该平台的构建是基于Chrome's JavaScript runtime,也就是说,实际上它是对Google V8引擎(应用于Google Chrome浏览器)进行了封装。 今天介绍Node.js调式目前有几种技术,需要的朋友可以参考下。
    2017-03-03
  • NodeJS中配置请求代理服务器方式

    NodeJS中配置请求代理服务器方式

    这篇文章主要介绍了NodeJS中配置请求代理服务器方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-10-10

最新评论