如何开发自己的npm包并上传到npm官网可以下载

目录

搭建文件结构

开始编写

发布到npm

如何下载我们发布的npm包


搭建文件结构

先创建新文件夹,按照下面的样子布局

  1. .├── README.md //说明文档

  2. ├── index.js //主入口

  3. ├── lib //功能文件

  4. └── tests //测试用例

然后再此根目录下初始化package包

bash 复制代码
npm init -y   //-y表示yes 可加可不加

会多出一个package.json文件

  1. ├── README.md //说明文档

  2. ├── index.js //主入口

  3. ├── lib //功能文件

  4. ├── package.json //包信息

  5. └── tests //测试用例


package.json

javascript 复制代码
{
  "name": "test",//名字
  "version": "1.0.0",
  "description": "", //介绍
  "main": "index.js",//主入口
  "directories": {
    "lib": "lib",
    "test": "tests"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [], //搜索关键字
  "author": "", //作者
  "license": "ISC"
}

一定记得再package.json中加上 "type":"module" 否者不能使用import

开始编写

我们在lib下面新创建功能性js文件

test1.js

javascript 复制代码
export function do11() {
    console.log("成功运行了!");
}

index.js中

javascript 复制代码
import {do11} from "./lib/test1.js"
export default {
    Do11: do11
}

再tests下创建测试文件test.js

test.js

javascript 复制代码
import obj from '../index.js'
obj.Do11()

运行test.js 成功


目前的整体文件结构

发布到npm

我们先需要在npm官网注册一个账号

npm官网


注册完成后再我们的根目录命令行输入

bash 复制代码
npm login

会让你输入用户名,密码,邮箱


随后会让你输入发送到你邮箱的一个验证码 然后结束登录操作
然后我们就可以输入

bash 复制代码
npm publish

来发布啦!

如何下载我们发布的npm包

来到我们的账号这里点击Packages

就可以看见我们发布的包,点进去

这里的install就是我们的下载方法

到此我们发布了我们的第一个功能性npm包!

相关推荐
问心无愧051333 分钟前
ctf show web入门160 161
前端·笔记
李小白661 小时前
第四天-WEB服务器基本原理,IIS服务
运维·服务器·前端
humcomm1 小时前
AI编程时代新前端职位
前端·ai编程
好家伙VCC2 小时前
Web Components主题热切换方案揭秘
java·前端
甲维斯2 小时前
Kimi版超级玛丽效果“惊人”,配额不足5厘米!
前端·人工智能
hboot2 小时前
AI工程师第一课 - Python
前端·后端·python
凉菜凉凉2 小时前
AI时代,被抛弃的前端
前端·ai
console.log('npc')3 小时前
AI前端工程与生成式UI学习路线
前端·人工智能·ui
梦曦i3 小时前
uni-router v1.1.1发布:守卫超时保护+路由监听
前端·uni-app
qq_2518364573 小时前
基于java Web网络订餐系统设计与实现 源码文档
java·开发语言·前端