如何发布一个npm包

NPM组件封装+发布 3. src下新建components文件夹,在内部书写组件内容,新建index.js文件导出组件。6. 保持NPM官网登陆状态(必须),然后在终端执行。然后输入 用户名、密码、邮箱、邮箱验证码,然后回车。5. 修改webpack.config.js。终端输入 npm publish,进行发布。初始化项目,进入项目、安装依赖、启动项目。4. 修改pageage.json。7. NPM官网操作权限和名称。1. NPM官网注册、登录。 阅读详情

1. 准备工作

  1. 安装node

    https://www.runoob.com/nodejs/nodejs-install-setup.html

  2. 去npm官网注册一个账号

    官网地址:https://www.npmjs.com/

2. 本地创建一个项目包

  1. 创建一个文件夹,自定义名称,此处设为 cm-first-npm-demo

  2. 命令行进入文件夹下,输入 npm init -y 快速初始化项目,或输入npm init并依次输入以下信息

    字段名字段含义
    package name包名
    version: (1.0.0)包的版本,默认是1.0.0
    description包的描述信息
    entry point入口文件,默认是 index.js
    test command测试命令,可直接回车忽略
    git repositorygit仓库地址,可直接回车忽略
    keywords索引关键字,便于别人搜索到你的包
    author作者
    license许可信息,直接回车

    填完之后,会有以下提示信息

    About to write to xxx/package.json:
    
    {
      "name": "xxx",
      "version": "1.0.0",
      "description": "一个npm测试包",
      "main": "index.js",
      "scripts": {
        "test": ""
      },
      "author": "",
      "license": ""
    }
    
    
    Is this OK? (yes) 
    

    直接回车,我们会看到文件夹下有个 package.json 文件,如果你想修改包的信息,可直接在此文件中修改保存。

  3. 创建一个 index.js 文件,写入一个加法函数作为测试函数,代码如下:

    module.exports.add = function  (a, b) {
     return a + b
    }
    

3. 发布包

  1. 以管理员身份运行命令行

  2. 修改npm仓库源,输入

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

    注:包发布完成后切回淘宝源

    npm config set registry https://registry.npmmirror.com/
    
  3. 进入 cm-first-npm-demo 文件夹下,输入

    npm login
    

    填写用户名、密码、邮箱后完成登录

  4. 发布包

    npm publish
    
  5. 登录npm官网查看包是否发布成功

    image-20220305170602969

4. 测试包

  1. 创建一个文件夹,自定义名称,此处设为 npm-test,作为引入发布包的测试项目

  2. 命令行进入文件夹下,快速初始化项目

    npm init -y
    
  3. 安装我们所发布包

    npm i cm-first-npm-demo -S
    
  4. 创建 index.js 文件,引入发布包,代码如下

    const npmDemo = require('cm-first-npm-demo')
    
    console.log(npmDemo.add(33, 44))
    
  5. 修改 package.json 文件,在script中添加 "start": "node index.js",如

    "scripts": {
      "start": "node index.js"
    }
    
  6. 输入 npm start,输出 77,包引入成功 image-20220305160955549

5. 可能出现的问题

  1. 登录时:image-20220305150907872

    解决方式:切换到管理员

    解决方式:输入邮箱接收到的一次性验证码。

  2. 安装包时

    image-20220305152439061

    解决方式:

    (1)等个十几分钟,登录https://npmmirror.com/,查看自己的包是否已被同步。

    image-20220305162726883

    (2)如果已同步,修改npm仓库源,再次安装

    npm config set registry https://registry.npmmirror.com/
    npm i cm-first-npm-demo -S
    

6. 有关包的导入

在上面的测试包中,我们使用 module.exports 进行导出,require 进行导入,那么使用 module.exports 或 exports 进行导出,能否使用 import 进行导入呢?

因为node使用的是CommonJs规范,不支持直接在js中使用 import,故我们在测试项目 npm-test 下新建文件 index.mjs,并写入以下代码

import npmDemo from 'cm-first-npm-demo'

console.log(npmDemo.add(33, 44))

命令行进入文件夹下,输入

node index.mjs

输出如下

image-20220305175717625

所以,对于发布的包,如果我们使用 module.exports 或 exports 进行导出,既能使用 require,也能使用 import 进行导入。

STM32CubeMX+Keil5实战:手把手教你用STM32F103C8T6开发扫地机器人(附完整代码) 本文详细介绍了如何使用STM32F103C8T6开发智能扫地机器人,从STM32CubeMX配置到Keil5代码实现的全过程。涵盖硬件选型、时钟树配置、GPIO外设设置、电机驱动、超声波测距及自动避障算法等核心内容,并提供完整代码示例,助力开发者快速掌握智能硬件开发技巧。 阅读详情

相关推荐

深入SVT SPI VIP配置:如何灵活控制CS间隔、数据帧大小与时钟频率(含代码片段)

本文深入探讨了SVT SPI VIP的高级配置技巧,包括精确控制CS信号间隔、突破数据帧大小限制以及动态时钟频率切换。通过实战代码片段和详细配置步骤,帮助验证工程师灵活应对复杂SPI协议验证场景,提升验证效率和覆盖率。特别适合需要处理非标准SPI时序和特殊数据帧的芯片验证项目。

weixin_27014595的博客 281

npm包及导入导出模块在Javascript中的应用

Javascript中npm包及模块使用实例

weixin_40524709的博客 5498

手把手教你配置MAX96712解串器:从I2C地址分配到PWM帧同步

本文详细解析了MAX96712解串器在自动驾驶视觉链路中的核心配置流程。从I2C地址分配、GMSL2数据流映射到实现多摄像头精准同步的PWM帧同步触发,手把手指导工程师构建高可靠性的图像传输系统,并提供了实用的Linux调试技巧与问题排查思路。

weixin_29297127的博客 927

npm如何发包、测试以及删除发布包?

npm发包删包测试

qq_43498164的博客 748

MBIST --- PATR2.Memorybist 测试流程

mem bist作为现在design设计中不可或缺的DFT设计内容,越发重要。本章节主要介绍mem bist的flow,如何在tessent中实现mbist以及tessent中的一些命令和mode。

sinat_27691203的博客 6010

【已解决,极简单!!】求助,R语言读取csv文件各种报错

【已解决】本来之前没问题,今天更新了Rstudioh以及R,就各种报错了。也看了目前能读取到的文件,从第一个中文字符直接就没有了。也就是说 还是读取中文字符的问题?新人初学,求大佬轻喷!

youyouluming945的博客 3878

原来发布一个 npm 包如此简单

我们都用过npm,也安装过npm包,也知道npm官网,但是了解过那些包是怎么来的吗?其实我们也可以发布npm包。经过几天的尝试,我也成功发了一个测试包,接下来我将介绍自己如何发布一个npm包。通过几天的研究以及学习,了解了如何发布一个npm包,以及更新npm包。简单来说就是发布通过publish,更新通过version。整体流程看起来还是挺简单的,但是还是需要自己去尝试才行,只有通过自己的尝试才能发现会出现哪些问题。

军火库 633

libopus 实现pcm 编码到opus

opus 是一种音频格式,常用于语音通话、视频会议中。最近做了个pcm 到opus 的编码,踩了不少坑,特此记录一下。

sinat_27720649的博客 9476

npm 下载第三方包

npmnpm包管理使用npm下载第三方包到本地npm初始化在cmd中切换到项目目录package.json的作用package.json文件中的一些属性生产环境安装依赖模块开发环境依赖模块安装全部依赖 npm包管理 npm是随着node一起的,安装了node,npm也就同样安装了。只要安装了node,就可以通过命令行使用npm了 在命令行内输入 npm --version 或者npm -v 即可查看npm的版本号 npm的卸载:卸载了node,就等于卸载了npm 使用npm下载第三方包到本地 按下键盘

m0_55832273的博客 6058

win10和Mac上安装Freesurfer

Mac安装Freesurfer 软件下载地址 可以根据官方给出的demo视频一步一步下载

Daily_365的博客 6079

从 AI 助手到 ADT 自动化桥梁:全面解析 Vibing Steampunk 的定位、能力边界与典型使用场合

Vibing Steampunk是一个面向SAP ABAP开发的AI自动化工具集,它通过ADT API将SAP开发能力系统化地暴露给AI助手和命令行工作流。该工具支持ECC、S/4HANA等所有启用ADT的系统,提供代码读取、修改、测试、调试等全流程自动化能力。核心功能包括AI调试、上下文压缩、ABAP语言服务、Lua脚本自动化等,并内置多重安全控制。其分层架构兼容标准ADT和WebSocket扩展,既适合AI驱动开发,也支持传统DevOps自动化,特别适用于老系统代码考古、知识接力和复杂问题诊断场景。

2007 年 ~ 2025 年,深耕 SAP 技术 18 年 152

【Npm】如何发布一个npm包?

前端日常开发经常会通过 npm install安装一些包,那这些包都是怎么发布的呢? 接下来让我们动手发布一个自己的npm 包。 windows系统下演示: 步骤一、注册npm账号 首先我们需要在npm官网注册一个自己的账号。 步骤二、登录 打开windows命令行,输入npm adduser: C:\Users\hp>npm adduser 根据提示输入之前注册的Username、Password和Email: Username: Password: Email: (this IS pub.

lynnhgwang的博客 3224

【多目标跟踪】ByteTrack复现(有yolov5例子)

1.环境 ubuntu16.04 cuda10.1 cudnn7 python3.6 Cython matplotlib>=3.2.2 numpy>=1.18.5 opencv-python>=4.1.2 Pillow PyYAML>=5.3 scipy>=1.4.1 tensorboard>=2.2 torch>=1.7.0 torchvision>=0.8.1 tqdm>=4.41.0 seaborn>=0.11.0 easydic

聿默的博客 1万+

发布一个eslint的npm包

1.npm基本命令 1.1安装模块 【npm install xxx】利用 npm 安装xxx模块到当前命令行所在目录; 【npm install -g xxx】利用npm安装全局模块xxx; 【 npm install --force】强制更新; 【npm install xxx】安装但不写入package.json; 【npm install xxx –save】 安装并写入package.json的”dependencies”中; 【npm i

weixin_49015558的博客 2757

OV9734 DATASHEET,完整规格书

OV9734完整规格书,包括电气参数,尺寸规格,寄存器配置表等

Probability and Statistics - 4th edition

Probability and Statistics - 4th edition

发布一个自己的NPM包

发布一个自己的NPM包 用了这么多次别人发布的包,今天咱们自己发布一个npm包 首先检查npm源 npm get registry # 如果不是这个地址https://registry.npmjs.org 需要设置官网源 npm config set registry https://registry.npmjs.org 复制代码如果是使用第三方源请设置npm官方源 (注):第三方源只提供下载功...

weixin_34405332的博客 205

汉书HE8,好用的汇编代码编写工具

汉书HE8,好用的汇编代码编写工具早期编写汇编代码所用功能强大

制作并发布一个Vue组件npm包

制作并发布一个Vue组件npm包 本人以前从来没有发不过npm包,所以写此篇文章用来记录发布一个npm包的步骤,当然也借鉴了网友的操作步骤,此篇文章用来作为一个笔记记录。 整个的基础的目录结构是: 创建Vue组件 本地创建一个项目文件,进入文件中 执行 npm init 按照提示输入即可,文件中生成package.json文件 相信很对人对于package.json的配置是相当熟练了 对于...

guyue_01的博客 3628

NTscan扫描工具

ntscan是一个扫描器,可以扫描没有密码和弱密码的共享,先到配置文件中填写猜测的用户名和密码,扫描过程中右侧出现的是扫描日志。

html可以引入npm包吗,基于vue如何发布一个npm包的方法步骤

前言:工作的时候总是使用别人的npm包,然而我有时心底会好奇自己如何发布一个npm包呢,什么时候自己的包能够被很多人喜欢并使用呢...今天我终于迈出了第一步。前提:会使用 npm,有 vue 基础,了解一点 webpackAre you ready? Go!一、编写自己的npm包1. 新建一个空文件夹2. 进入文件夹,终端(cmd)运行 npm init完成后会在目录下生成一个 package.j...

weixin_39878247的博客 1712

发布一个npm包

发布一个npm包 前言 我这里是写了一个vue轮播图插件,因此我使用了vue的脚手架工具创建一个项目,当然你也可以选择自己搭建脚手架。 本例中我会使用vue脚手架创建一个项目,并发布到npm上面去。 通过脚手架创建项目 全局安装 首先,要创建项目,封装vue的插件用webpack-simple很合适,因此你需要全局安装@vue/cli-init插件...

David 398

发布一个简单的npm包

技术是没有终点的,也是学不完的,最重要的是活着、不秃。零基础入门的时候看书还是看视频,我觉得成年人,何必做选择题呢,两个都要。喜欢看书就看书,喜欢看视频就看视频。最重要的是在自学的过程中,一定不要眼高手低,要实战,把学到的技术投入到项目当中,解决问题,之后进一步锤炼自己的技术。技术学到手后,就要开始准备面试了,找工作的时候一定要好好准备简历,毕竟简历是找工作的敲门砖,还有就是要多做面试题,复习巩固。有需要面试题资料的朋友点击这里可以领取。视频就看视频。

2401_84094620的博客 1137

【npm进阶】5、从零开始发布你的第一个npm包

npm,全称为 Node Package Manager,是一个 JavaScript 包管理工具和软件仓库。它最初是为 Node.js 设计的,但现在也可以用于前端开发。npm 允许开发者轻松地安装、共享和管理项目中的依赖包,从而简化了项目的开发过程。通过 npm,开发者可以访问庞大的开源库,快速集成各种功能模块,提升开发效率。此外,npm 还提供了版本管理和冲突解决机制,使得项目依赖关系更加稳定和可靠。

weixin_52938153的博客 1219

npm系列--手把手教你用npm发布第一个npm包的详细教程

我们已经实现了路由的自动化构建,但是我们可以看到,一大串代码怼在里面。当然你也可以说,把它封装在一个JS文件里面,然后使用 require('./autoRoute.js') 给引入进来,那也行。但是,为什么不把心放大一点呢?比如说,我们把它做成一个npm包! 最初自己做的时候就是这种直接引入封装的JS文件里,可以参考: https://github.com/saucxs/water...

saucxs 1995

发布自己的第一个npm/yarn包

发布自己的第一个npm/yarn包

文艺倾年的博客 621

日常随笔:发布一个npm包

npm包发布流程实例 编写基础的模块代码 注册npm帐号(有的话直接进入下一步) 配置webpack 配置package.json 优化(ReadMe+单元测试) 发布 1. 编写一个简单的Math库 math.js // math.js const square = x => x ** 2; const cube = x => x ** 3; export const My...

qq_24724109的博客 223

怎么发布一个npm包

怎么发布一个npm包 创建一个npm账号,一般用邮箱与密码注册登录即可。npm注册 创建一个文件夹,比如名称为xcc mkdir xcc && cd xcc npm init 填入你希望的包的名称与版本号即可,假如包的名称为xcc-standrad-eslint,版本为0.1.0 xcc文件夹创建index.js文件,随便写点内容即可 如果本机第一次发布npm包 npm adduser 会要求填入用户名与密码,还有邮箱等信息,填写注册npm时的账号即可 信息正确后会出现Logged

xccjk的博客 130
上一篇: 详解排序算法(一)之3种插入排序(直接插入、折半插入、希尔)
下一篇: 详解排序算法(二)之2种交换排序(冒泡排序、快速排序)
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值