JavaScript常用工具函数提高生产力

前言

项目中经常会用到一些工具函数，比如：

• 字符串和数组的操作。
• 数字的随机值、平均值的计算。
• 浮点数0.1 + 0.2 = 0.30000000000000004的解决方案。
• 深克隆，函数节流和函数防抖等。

内容参考自:medium(需要梯子):127 Helpful JavaScript Snippets You Can Learn in 30 Seconds or Less — Part 1 of 6

将里面的代码经过筛选之后，再结合自己再项目中会经常会使用到一些工具函数，用<font color=red>TypeScript</font> 封装并发布到<font color=red>NPM</font>上。

这样在多个项目中都能共用到这些函数，提高<font color=red>生产力</font>和代码的<font color=red>维护性</font>。

<font color=red>详细的文档:</font> http:snippets.fancystore.cn

技术背景

1. 基于 <font color=red>TypeScript</font> 强类型编写代码，在转换成JS。
2. 使用 <font color=red>Jest</font> 做单元测试。
3. 使用 <font color=red>VuePress</font> 做技术文档。

项目结构

项目安装

npm install util-snippets

项目使用

import { xxx } from 'util-snippets'

项目本地测试

git clone https://github.com/czero1995/util-snippets.git

cd util-snippets

npm install // 安装项目依赖

npm run tsc:w // 将TypeScript实时转换为JavaScriot,方便调试

npm link // 相当于npm install util-snippets

在其他项目直接使用导入就可以使用了 <font color=red>import { xxx } from 'util-snippets'</font>

本地测试执行npm link之后，会直接生效，不需要反复打包和发布。

发布到NPM

1.注册NPM账号

先去官网注册一个账号，填写好账号、密码、邮箱

https://www.npmjs.com/

2.初始化项目

创建util-snippets文件夹

mkdir util-snippets 

初始化package.json

 npm init

填写好npm包的信息，作者信息，版本信息，并在<font color=red>package.json</font>中的字段指定入口文件是<font color=red>./build/index.js</font>

 "main": "./build/index.js"

将<font color=red>TypeScript</font>项目转化成<font color=red>JavaScript</font>，再打包的时候运行单元测试，如果单元测试通过，打包完成，就可以执行发布到NPM上了。

项目地址

Github: https://github.com/czero1995/util-snippets

NPM: https://www.npmjs.com/package/util-snippets

文档: http:snippets.fancystore.cn