Attempted import error: 'styles' is not exported from './styles.scss' (imported as 'styles')

Question

伙计们

我正在尝试构建我的 React 项目，但它一直说

'Attempted import error: 'styles' is not exported from './styles.module.scss' (imported as 'styles').'

所以，我想我的 webpack 配置文件中的设置有误，但我不知道那里出了什么问题。我正在使用 css 模块，所以尝试过这种方式 https://www.gatsbyjs.com/docs/reference/release-notes/migrating-from-v2-to-v3/#css-modules-are-imported-as-es-modules，但对我不起作用。

这是我使用样式的源文件之一

import styles from "./styles.scss";
import { withRouter } from "react-router";

const ArrowBack = ({ history, onClick }) => {
    return (
        <button type="button" onClick={onClick || history.goBack} className={styles.arrowBack}>
            <span className={styles.bar}></span>
        </button>
    );
};

export default withRouter(ArrowBack);

这是我的文件

webpack 配置 https://gist.github.com/bbatta38/45695862bdde7928b788420793c006b6
套餐json https://gist.github.com/bbatta38/4b91a2b84aaa237b54277b78525f8473
构建 js https://gist.github.com/bbatta38/e18792375a107afcfedfeba48bc3fe1e

已经两天了才找到让它起作用的方法。如果您有任何解决此错误的想法，请帮助我。

Answer 1

从 Gatsby v3 开始，您需要像这样导入样式：

import * as styles from './styles.module.scss'

Answer 2

尝试

import styles from "./styles.module.scss";

您似乎缺少文件名中的 'module'。

Attempted import error: 'styles' is not exported from './styles.scss' (imported as 'styles')

Attempted import error: 'styles' is not exported from './styles.scss' (imported as 'styles')

css

sass

reactjs

css-modules