背景
在前端领域，测试代码的编写和执行是非常重要的一环。Jest 是一个强大的测试框架，它可以处理 JavaScript、TypeScript、React、Vue 等广泛的前端项目。在 Jest 中，我们可以自定义 Transformers 来处理测试代码中的 import/export 等语法。这就是 @sucrase/jest-plugin 产生的宗旨。
安装
在安装 @sucrase/jest-plugin 时，它会同时安装 sucrase 和 jest，因此您无需手动安装这些库。
npm install --save-dev @sucrase/jest-plugin
设置
在 Jest 的配置文件中，添加 @sucrase/jest-plugin 作为 moduleFileExtensions 类型的值。在这个设置中，Jest 将会自动在测试前使用 sucrase 对测试代码进行处理，以让 Jest 能够正确地解析模板。
-- -------------------- ---- -------
-- --------------
-------------- - -
----------------------- -
-----
------
-----
-----
-------
------
--
------------ -
------------------------- --------------
-
--示例
让我们来编写一个简单的 Jest 测试代码文件 example.spec.js：
import { add } from './example.js';
describe('Test example.js', () => {
it('should return the correct result', () => {
expect(add(1, 2)).toEqual(3);
});
});在默认情况下，Jest 无法处理文件导入和导出，因此就无法对测试文件进行测试。但是我们可以使用 @sucrase/jest-plugin 将测试代码转换为 CommonJS 格式，使 Jest 能够正常工作。
const { add } = require('./example.js');
describe('Test example.js', () => {
it('should return the correct result', () => {
expect(add(1, 2)).toEqual(3);
});
});结论
通过 @sucrase/jest-plugin，我们可以像普通的 CommonJS 模块一样编写 Jest 测试代码，而不必担心 babel 的配置问题。这使得我们的测试代码更加简洁和易于阅读。在实践中，我们可以使用 @sucrase/jest-plugin 来确保项目的稳定性，同时从繁重的 babel 配置中解放出来。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/sucrase-jest-plugin