小编use*_*459的帖子

我最近开始在我的 react-typescript 项目中使用故事书，但遇到了以下问题：

1. 我的 react-bootstrap 组件没有样式。组件已加载但没有样式。我尝试在自定义 webpack 配置中使用样式加载器和 css 加载器，但没有奏效。
2. 我正在导入一些本地字体，但字体始终加载在 Fonts 文件夹中。有没有办法在 /static/fonts 目录中加载字体？我正在使用文件加载器来加载字体。
3. 我有一个 globalStyles.tsx 文件和一个 iconStyles.tsx 文件，我想将它们全局包含在故事板 iframe 中。最好的方法是什么？

我在本地主机上本地运行故事书。

下面是我的带有自定义 webpack 配置的 main.js：

module.exports = {
  stories: ['../src/stories/**/*.stories.[tj]s','../src/stories/**/*.stories.tsx'],
  addons: ['@storybook/addon-actions', '@storybook/addon-links'],
  webpackFinal: async config => {
    config.module.rules.push({
      test: /(?<!.*\.test)\.(ts|tsx)$/,
      use: [
        {
          loader: require.resolve('ts-loader'),
        }
      ]
    },
    {
      test: /\.ttf$|\.woff$|\.eot$|\.otf$/,
      use: [
        {
        loader: 'file-loader',
        options: {
          outputPath: '/static/fonts',
        },

        },
      ]

    },
    {
      test: /\.css$/,
      use: ['style-loader', 'css-loader']
    }
    );
    config.resolve.extensions.push('.ts', '.tsx');
    return config;
  }, …

我将我的文本附加到异物内的 div 中。文本在 chrome 中呈现良好，但在 IE 中根本不显示。我研究了一下，好像IE不支持异物。是否有解决方法可以使其在 IE 中工作？

PS 我正在使用 d3.js 创建圆圈，而我的异物在圆圈中。我使用异物来解决文本对齐问题。

我在这里先向您的帮助表示感谢。

我在 JavaScript 中有以下代码：

class SampleClass {
  constructor(param1) {
    this.param1 = param1;
    this.init();
  }
  async init() {
    await this.getData();
    this.loadIframe();
  }
  async getData() {
    const response = fetch(url);
    const data = response.json();
    //set the response to class variable
    this.param2 = data;
  }
  loadIframe() {
    //some logic to load iframe.
  }
}

使用笑话测试此功能的最佳方法是什么？

目前我正在通过模拟 init() 函数来测试构造函数逻辑。

但我还必须测试 getData()函数。测试 getData() 方法的方法应该是什么？

我尝试通过不模拟 init() 函数并使用异步测试来测试 getData() 函数，但我不确定 在测试中在哪里使用等待，因为该函数是嵌套的，并从从构造函数调用的 init 中调用。

it('should fetch data', async()=>{
   //some logic  
})