css - 无法为 Storybook Angular 中的外部库正确加载 CSS

Question

我正在使用带有项目样式设置的 Angular（使用 --create-application=false），我只是无法让 Storybook 从外部库（如 Angular Material）加载任何 CSS。项目组件 scss 编译并工作正常，但没有一个外部库可以加载任何 css。

这是我的storybook/main.js-

const path = require('path');

module.exports = {
  "stories": [
    "../stories/**/*.stories.mdx",
    "../stories/**/*.stories.@(js|jsx|ts|tsx)"
  ],
  "addons": [
    "@storybook/addon-links",
    "@storybook/addon-essentials"
  ],
  webpackFinal: async (config, { configType }) => {
    // `configType` has a value of 'DEVELOPMENT' or 'PRODUCTION'
    // You can change the configuration based on that.
    // 'PRODUCTION' is used when building the static version of storybook.

    // Make whatever fine-grained changes you need
    config.module.rules.push({
      test: /\.scss$/,
      use: ['style-loader', 'css-loader', 'sass-loader'],
      include: path.resolve(__dirname, '../'),
    });

    // Return the altered config
    return config;
  }
}

这是我的项目结构-

有人可以指出问题所在吗？

标签： cssangularstorybook