1.0.2 • Published 3 years ago

hzx-jslibs v1.0.2

Weekly downloads
92
License
ISC
Repository
-
Last release
3 years ago

JsLibs

介绍

一些随意封装的 js 函数

使用说明

1. 通过 git

// 下载

> git clone git@gitee.com:xiaoliu666666/jsLibs.git //也可直接将 **export.js** 和 **index.js** 文件复制到项目中

// 引入
import JsLibs from '@/utils/jsLibs/index.js'

// 使用
console.log(jsLibs.getMax([10,20,30])); // 30

2. 使用 npm

// 下载

npm install hzx-jslibs

// 引入
import JsLibs from 'hzx-jslibs'

// 使用
console.log(jsLibs.getMax([10,20,30])); // 30

3. 挂载到 vue 实例

// main.js
import JsLibs from '@/utils/jsLibs/index.js'
Vue.prototype.$ = JsLibs

// 使用
console.log(this.$.getMax([10,20,30])); // 30

开发指南

1. 安装依赖

npm install 
  • 所需依赖如下
  • nodemon: 监听文件变化,重启 Node 服务器
  • browserify:将 Node.js 模块转为浏览器支持的 js 文件
  • jest: 测试框架
  • jsdoc: 根据注释生成文档
  • docdash: 文档主题

2. 运行和编译

在 Node.js 环境运行

npm run serve // 启动 Node 服务器

打包到浏览器环境运行(不支持实时编译)

npm run build // 将文件编译为浏览器支持的文件

3. 新增函数

(1) 新增测试用例

在 test 文件夹下新增测试用例,测试驱动开发,代码编写完毕后应确保测试全部通过

  • 在 tests 文件夹下,新建函数对应的测试文件,必须以 .test.js 结尾
  • describe 命令对测试用例进行分组,通常一个函数为一组
  • test 命令为单个单元测试,expect 为预期的结果,参考 断言归纳
  • 应列举所有可能的输入和输出,并确保测试通过
npm run test // 函数实现后,执行测试

npm run coverage // 生成测试的覆盖率报告,生成文件在 coverage 下

(2) 新增函数

在 libs 文件夹下新增函数,通过 module.exports 导出(必须用用单独导出的方式

// yes
module.exports.getMax = getMax
// no
module.exports = { getMax }

手动测试函数

  • 在根目录下的 index.js 中,新建 JsLibs 实例进行测试,只用于临时测试,测试通过的函数,及时删除测试

(3) 生成文档

确认变更已经 npm run serve 过,否则无法生成最新的文档,文档取自 export.js 中的注释

npm run doc // 生成文件在 doc 文件夹

文档由代码注释块自动生成,注释格式如下,参考JsDoc使用

/**
 * 判断数据类型
 * 
 * @memberof is
 * 
 * @param {Any} value 数据(必传)
 * 
 * @param {String} type 类型(必传)
 * <br /> 可选:Array,Object,Number,String,Boolean,Undefined,Null,Function
 * 
 * @returns true or false
 * 
 * @example  
 * isType(1,'Number'); // true
 * getMax({name:'zhangsan'},'Array'); // false
 *
 */

libs 库中 namespace 下的 namespace.js 为文档的目录结构,也是注释中 @memberof 的取值,格式如下:

/**
 * @namespace is
 */
 function is(){
    
 }

4.修改版本

修改 index.js 中的 _v 号,x.y.z 代表:

  • x: 结构性变更
  • y: 新增,删除函数或功能
  • z: 修复bug,优化内容

在 log.md 中补充变更内容

发布流程

  • 登陆
npm login 
  • 发布
npm publish // 发布前必须更新 package.json 中的 version 号

整体流程

libs 文件夹 -> 拼接成export.js -> 挂载到 JsLibs 原型链上 -> 实例化 JsLibs

注:外部使用时,直接调用拼接的 export.js,不会再遍历 libs 文件夹