提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  其他

当前栏目

单位转换工具 & 怎么发一个npm 包

工具
2023-03-14 22:54:46 时间

业务需求

wiki.envisioncn.com/pages/viewp…

起因：页面上有个数值特别长，有没有一个单位自动转换工具，让页面展示得更简洁？如10000000kg 展示为10kt 或 1万吨。

初始单位为吨

单位自动转换

单位转换包——@enos/unit-conversion

安装和使用： npm.envisioncn.com/package/@en…

基本用法

传参：初始数值，初始单位，保留小数点位数（默认保留两位）

const result = unitConversion.getConversionResult(12345, 'kWh', 2); 
// 结果
// 中文环境：{num: 1.23,unit: "万kWh",rate: 10000} 
// 英文环境：{num: 12.35,unit: "MWh",rate: 1000}
// rate为（初始值 / 转化后的值），为1则是未转化成功
复制代码

指定目标单位

目标单位区分中英文环境

const resultZh = unitConversion.getConversionResult(12345, 't', 2, '千克'); 
// resultZh {num: 12345000, unit: '千克', rate: 0.001}
const resultEn = unitConversion.getConversionResult(12345, 't', 2, 'kg'); 
// resultEn {num: 12345000, unit: 'kg', rate: 0.001}
复制代码

为什么指定单位要区分中英文？

因为中英文的单位可能不一致。 当前库中维护的单位有:

[
//电量
  {
    unitEn: {
      unit: ['kWh', 'MWh', 'GWh'],
      rate: 1000
    },
    unitZh: {
      unit: ['kWh', '万kWh', '亿kWh'],
      rate: 10000
    }
  },
  //功率
  {
    unitEn: {
      unit: ['kW', 'MW', 'GW'],
      rate: 1000
    },
    unitZh: {
      unit: ['kW', 'MW', 'GW'],
      rate: 1000
    }
  },
  //质量
  {
    unitEn: {
      unit: ['kg', 't', 'kt'],
      rate: [1, 1000, 1000 * 1000]
    },
    unitZh: {
      unit: ['千克', '吨', '万吨', '亿吨'],
      rate: [1, 1000, 1000 * 10000, 1000 * 10000 * 10000]
    }
  },
  //热量
  {
    unitEn: {
      unit: ['kJ', 'MJ', 'GJ'],
      rate: 1000
    },
    unitZh: {
      unit: ['kJ', 'MJ', 'GJ'],
      rate: 1000
    }
  },
  //液体体积
  {
    unitEn: {
      unit: ['L', 'kL'],
      rate: 1000
    },
    unitZh: {
      unit: ['L', 'kL'],
      rate: 1000
    }
  },
  //固体体积
  {
    unitEn: {
      unit: ['m3', 'km3'],
      rate: 1000000000
    },
    unitZh: {
      unit: ['m3', 'km3'],
      rate: 1000000000
    }
  }
];
复制代码
  • 进率支持统一进率——rate为number，也支持不同的进率——rate为array

这些单位没覆盖我的单位怎么办？

自定义单位

  • 新增单位：支持新增单位，格式为object[]。
const unitArray = [{
  unitEn: {
    unit: ['kWh', 'MWh', 'GWh'],
    rate: 1000 // 或rate:[1,1000,1000*1000]
  },
  unitZh: {
    unit: ['kWh', '万kWh', '亿kWh'],
    rate: 10000 // 或rate:[1,10000,10000*10000]
  }
}]
 // unitConversion.addUnits(unitArray)
复制代码
  • 覆盖单位：支持覆盖单位，则只根据用户提供的单位进行转换
const unitArray = [{
  unitEn: {
    unit: ['kWh', 'MWh', 'GWh'],
    rate: 1000
  },
  unitZh: {
    unit: ['kWh', '万kWh', '亿kWh'],
    rate: 10000
  }
}]
unitConversion.replaceUnits(unitArray) 
复制代码

怎么发一个npm包

wiki.envisioncn.com/pages/viewp… 发到cnpm需要admin权限

我们以发到npm 举例。

  1. 新用户到www.npmjs.com/ 注册账号
  2. 查看要发布项目的registry， 如果不符合则需要切换 
npm config set registry https://registry.npmjs.org/
复制代码
  1. npm login 登录——填写用户名、密码、邮箱
  2. npm publish 发布
  • 问题1：the package has been marked as private —— package.json中去掉"private": true
  • 问题2：You cannot publish over the previously published versions: xxx——每次发布需要更新版本号
  • 问题3：a package version that is forbidden by your security policy.——npm中有同名的包，需要改名

发布成功后邮箱会收到成功邮件。在npm个人主页可以看到这个新发上去的包。其他项目中通过npm install 或者yarn add可以引入并使用这个包。

  • 问题4：安装了新的包，但import 后无法使用。——检查package.json是否写了入口文件main

怎么本地调试一个npm包

  1. 在包项目A中 yarn link，得到连接“A”
  2. 在调试项目B中 yarn link "A"
  3. A中的修改会实时地在B中生效
  4. 取消连接使用 yarn unlink

相关文章