如何解决如何在故事书的故事中模拟模块?
我有一个Vue组件,其中包括一些具有复杂逻辑的外部模块。例如:
// Component.vue
import Vue from 'vue';
import { externalModule } from '@/path/to/module';
export default {
methods: {
useExternalModule() {
externalModule.doSomethig();
}
}
};
是否可以模拟故事中的externalModule
?
我正在使用Storybook v6。
解决方法
您可以创建一个__mocks__
文件夹以放入模拟组件。然后在.storybook/main.js
文件中,使用此文件夹将webpack指向您的模拟文件。
module.exports = {
// your Storybook configuration
webpackFinal: (config) => {
config.resolve.alias['externalModule'] = require.resolve('../__mocks__/externalModule.js');
return config;
},};
“模拟导入” https://storybook.js.org/docs/react/workflows/build-pages-with-storybook
下的文档中对此进行了介绍。但是,这是全局配置,而不是故事级别的配置。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。