SCSS文件中没有默认导出（Gatsby和Sass）。

Question

如果我不添加模块到扩展中，我知道我的路径是正确的，因为它会采用样式。我正在从一个一年半前结束的编程训练营中工作，并尝试研究任何可能的破坏性更改，但没有什么好消息。

提示link没有定义，而我的scss文件没有默认导出。

谢谢

.link {
  color: green;
}

import React from "react"
import { Link } from "gatsby"
import headerStyles from "../styles/header.module.scss"

const Header = () => {
  return (
    <header>
      <h1>My Portfolio</h1>
      <nav>
        <ul>
          <li>
            <Link className={headerStyles.link} to="/">
              Home
            </Link>
          </li>
          <li>
            <Link to="/about">About</Link>
          </li>
          <li>
            <Link to="/blog">Blog</Link>
          </li>
          <li>
            <Link to="/contact">Contact</Link>
          </li>
        </ul>
      </nav>
    </header>
  )
}

export default Header

import React from "react"
import { Link } from "gatsby"
import headerStyles from "../styles/header.module.scss"

const Header = () => {
  return (
    <header>
      <h1>My Portfolio</h1>
      <nav>
        <ul>
          <li>
            <Link className={headerStyles.link} to="/">
              Home
            </Link>
          </li>
          <li>
            <Link to="/about">About</Link>
          </li>
          <li>
            <Link to="/blog">Blog</Link>
          </li>
          <li>
            <Link to="/contact">Contact</Link>
          </li>
        </ul>
      </nav>
    </header>
  )
}

export default Header

- thomtheetoad

Answer 1

将gatsby更新到3版本后，我陷入了同样的境地。

* as sth 如果想要导入整个模块，这样写是可以的。

import * as headerStyles from "../styles/header.module.scss"

- Tatsuhiko Arai

---

似乎是一个bug，请关注此问题：https://github.com/gatsbyjs/gatsby/issues/30040 - Tatsuhiko Arai

这不是一个bug，它正在按照预期工作：https://www.gatsbyjs.com/docs/reference/release-notes/migrating-from-v2-to-v3/#css-modules-are-imported-as-es-modules - LekoArts

Answer 2

import { link } from "../styles/header.module.scss"

发布后立即使用解构修复了它。

- thomtheetoad

---

希望有一个默认的导出解决方案，这样就不需要逐个解构每个属性了。 - thomtheetoad

Answer 3

import * as headerStyles import './header.module.scss'

- Mahesh Muttinti

---

不鼓励只有代码的注释，请解释为什么这样做是可以的——尤其是因为它在语法上是不正确的。 - moopet