发布一个自己的npm包

当你想要发布一个npm包时，你需要以下一些准备工作

npm&npm账号首先已经全局安装npm依赖，并且你需要在npm官网上注册属于你自己的账号 npm官网 ，注册流程此处不再赘述，根据注册流程就行注册并登录即可（需要邮箱来接收验证码）

推荐可以使用nvm管理工具，同步切换node版本以及npm版本 nvm下载官网，如果切换版本nvm use 失败，尝试在管理员启动cmd后运行

npm源修改，发布npm包时，需要在命令行使用npm adduser，如果设置过淘宝镜像源，会导致403报错，该问题解决方法是切换回npm源后即可正常进行登录，此外发布包的时候也需要你的npm是原本官网的原地址

推荐使用 nrm工具管理npm 源地址命令npm i -g nrm ，安装过后 nrm ls 查看源列表，nrm use 切换对应源地址（我这边列表中已有taobao的镜像选项，但是地址不对，使用nrm del 等方法均没有修改成功，所以自行增加新的源 nrm add taobao2 registry.npm.taobao.org）

准备好你要发布的代码并准备开始发包

发布包流程

初始化项目包，填写相关的项目内容（项目名，作者，描述等，其余可以直接回车确认）

npm init -y // 初始化项目，生成package.json

此处使用ts进行项目代码书写，所以需要安装ts依赖（如果使用js可以忽略）

创建tsconfig.json可以使用命令创建，也可以自己手动创建，具体相关配置项可以在百度进行相关搜索

npm i -d typescript // 安装ts 
npx tsc --init  // 生成tsconfig.json文件 进行相应的设置

tsconfig.json文件内容如下

{
  "compilerOptions": {
    //编译选项
    "target": "ES2016", //配置编译目标代码的版本标准
    "module": "commonjs", //配置编辑目标使用的模块化标准
    "lib": ["ES2016", "DOM", "ESNext"],
    "outDir": "./dist", // 打包后输出目录
    "strictNullChecks": true, //严格空类型检查---null，undefined
    "removeComments": false, //编译后移除注释
    "noImplicitUseStrict": true, //编译是否是严格模式
    "esModuleInterop": true, // 弃用es模块化交互非es模块导出
    "noEmitOnError": true, //报错时不生成编译结果
    "moduleResolution": "node", // 编译策略
    "strictPropertyInitialization": true, // 严格属性初始化检查
    "skipLibCheck": true, // 忽略....,设置为true可以避免某些报错
    "declaration": true, // 生成.d.ts文件
    "declarationDir": "./dist", // 生成.d.ts文件目录
    "sourceMap": true, // 是否生成map文件
  },
  "include": ["./src"] //编译所选文件
}

更新package.json (如果使用js可以忽略)

{
  "main": "src/index.js", // 设置入口文件
  "module": "dist/index.js",
  "types" :"dist/index.d.ts",
  "scripts": {
    "build": "rd /s /q dist & npx tsc -p .", // 此处两个build命令二选一都可，npx tsc -p . 这个命不清楚他的参数作用
    "build2": "rd /s /q dist & tsc" // 移除之前的打包文件，并打包
  },
}

在根目录创建scr文件夹并创建index.ts文件（因为配置了上一步main路径是src/index.js,我自己认为是这样，这两个路径应该对应上）

type ILonLat  = number | string | any;
/**
 * 保留几位小数不是四舍五入
 * @param value 数值
 * @param decimal  =保留几位小数
 * @returns 处理后的值
 */
export const formatDecimal = (value:ILonLat, decimal:number = 7) => {
  value = value.toString();
  const index = value.indexOf(".");
  if (index !== -1) {
    value = value.substring(0, decimal + index + 1);
  } else {
    value = value.substring(0);
  }
  return +parseFloat(value).toFixed(decimal);
};

执行打包

npm run build

然后就可以上传npm包了，此时就需要你已经准备好的前置条件，npm账号以及正确的npm源地址
本地登录npm账号

# 输入自己的用户名，密码和邮箱(我是使用的Git bash，可以看到相对应的账号密码邮箱)
# 如果看不到，不需要担心，正常输入即可，
# 可能还需要输入一个一次性的验证码，会发送到你的邮箱内
npm adduser 
# 结束后验证是否登录成功，显示出了自己的用户名就算登录成功了
npm whoami

发布

等待流程结束后，就发布成功了，我自己没有遇到过发布失败，如果有报错再百度把

npm publish

然后就可以使用啦

npm i 包名   
import { 方法名 } from "包名";

更新包版本，有时候淘宝源的版本同步会滞后，通过手动同步，更新淘宝源的版本 地址

参考原文章链接

简单粗暴，发布一个自己的npm包

发布一个自己的npm包

发布包流程