故事书 - 包含资产文件夹中的 css 返回“拒绝包含...”错误

Posted 2023-02-19

【中文标题】故事书 - 包含资产文件夹中的 css 返回“拒绝包含...”错误

【英文标题】：Storybook - Include css from assets folder return "Refused to include..." error

【发布时间】：2020-01-09 04:26:10

【问题描述】：

我在我的 Storybook Stencil 项目中加入了 Font Awesome。 这是我的项目结构

|-> src
    |-> assets
        |-> fontawesome
            |-> css
                |-> all.css
|-> .storybook
    |-> manager-head.html
    |-> preview-head.html

为了使字体在故事书中很棒，正如我在文档中阅读的那样，我需要在 ma​​nager-head 和 preview-head 中包含此参考

<link
  rel="stylesheet"
  type="text/css"
  href="../src/assets/fontawesome/css/all.css"
/>

但是当我开始故事书时，我遇到了这个问题：

完整的错误是：

拒绝应用来自 'http://localhost:6007/src/assets/fontawesome/css/all.css' 的样式，因为它的 MIME 类型 ('text/html') 不是受支持的样式表 MIME 类型，并且启用了严格的 MIME 检查

我不知道为什么错误说MIME type ('text/html')，因为我写的是type="text/css" 路径是正确的，但我不知道为什么会出现此错误。

【参考方案1】：

你应该在 package.json 中指定静态文件的加载目录（例如你的 css 文件）：

您可以阅读有关 CLI 选项的更多信息here。