Mocking TypeScript 为 Storybook 导入

Question

我正在尝试模拟要在 Storybook 中使用的模块的导入，但我只能使用 JavaScript 和 CJS 导入，而不是 TypeScript 和 ESM。 我当前的webpackFinal包含这个

config.resolve.alias['moduleToMock'] = require.resolve('../src/mocks/mockModule')
return config;

此当前配置不适用于 TypeScript 并且会抛出一个错误，指出找不到模拟模块。 如何将其配置为与 TypeScript 一起使用？

Answer 1

通常 TypeScript 仅在您尝试编译代码时抛出错误。 如果您在代码执行时遇到错误，这很可能与您的代码重写有关。 如果 Storybook 的webpackFinal已经支持 ESM 并且您需要同步导入模块，那么您可以为 require function 创建一个替换，如下所示：

import { createRequire } from 'module'
const require = createRequire(import.meta.url)

...

config.resolve.alias['moduleToMock'] = require.resolve('../src/mocks/mockModule')

希望能帮助到你。