web

npm模块调试小技巧

Posted by wml on December 14, 2018

日常背景

最近在写一个parcel+ts+preact的CLI工具,开发过程中,少不了要做一些npm模块测试以及本地调试,下面两个是开发过程中比较实用的技能。

npm模块开发中,调试是不可获取的一环;如果每次都需要发到线上或者需要重新安装整个模块进行调试,那确实是一件很痛苦的事,那是否有方法能支持本地实时调试呢?答案是yes。

npm本身对于这种情况提供了专门的命令npm link 文档

使用npm link主要分为两步,

  1. 在开发的npm模块包文件夹所在位置执行npm link,将会在全局的包文件中创建一个链接与开发的npm模块相连,并且会链接到npm模块包中所有的bin文件,全局包的路径在windows下为{prefix}/node_modules/<package>
  2. 测试这个npm模块,选任意非开发的npm模块路径,执行npm link <packageName>,将会从全局文件中创建一个符号链接连接到当前的文件夹node_modules/<package>

packageName是指package.json中的name,而不是文件路径。

以上是官方给出的解释,经过简单翻译后得出的,可能听起来会有些绕,那么下面将结合实际例子加深下理解。

1、首先,在本地有一个开发中的npm模块,路径为D:\wwwroot\meetyou.alioss,想要在本地调试该模块,在当前路径下执行npm link,当出现如下提示则成功链接到全局。 link

可在全局路径中,以window为例的路径为C:\Users\Administrator\AppData\Roaming\npm\node_modules看到生成一个快捷文件,链接到开发路径中: link

此时可在全局使用bin下的命令,本例中创建了一个meetyou-alioss,

 "bin": {
    "meetyou-alioss": "index.js"
  }

此时可在全局任意环境中通过该命令执行相应脚本 link

2、或者通过node_modules测试该模块,本例中测试路径为D:\wwwroot\test-alioss,package.json下的name为

"name": "meetyou.alioss"

执行npm link meetyou.alioss,会创建一个从全局环境链接到改测试路径下的符号链接: link

在测试路径下可以看到生成的快捷文件 link

此时即可免安装调试本地的npm模块了 link

是不是很方便?去掉link也很简单

$ npm unlink meetyou.alioss

测试框架-mocha

mocha是比较热门的JavaScript框架之一,在浏览器和Node环境下都能使用的测试工具。

有形如以下脚本

/* index.js */
function sun(x, y) {
  console.log(`Hello module!`)
  return x + y;
}
module.exports = sum;

该示例下使用mocha测试库,在模块所在路径下安装mocha

npm i mocha --save-dev

测试脚本通常以源码脚本同名,后缀为.test.js;

测试脚本包含至少一个describe(测试套件)表示一组相关测试, 第一个测试是测试套件名称,第二个参数为实际执行参数;

it(测试用例)表示一个单独的测试用例;

一个测试用例也至少包含一句断言,Mocha本身不带断言库,所以需要引用。 有多种断言库,本例使用expect断言

/*index.test.js*/
var sum = require('../index.js');
var expect = require('chai').expect;

describe('加法函数测试', function() {
    it('2+3应等于5', function() {
        console.log(sum,777);
        expect(sum(2, 3)).to.be.equal(5);
    });
});

运行测试脚本,使用mocha index.test.js即可以看到运行结果, mocha默认执行test目录下脚本,放置于test目录下即可直接执行mocha; 默认执行第一层目录,添加–recursive参数即可执行所有test下脚本文件。

link