Question

我通过Create-React-App创建了一个新的react应用，并尝试使用CSS模块，但是它似乎不再起作用。这是我对CSS模块的简单用法：

import styles from './myStyle.css';

function App() {
  return (
    <div className={styles.container}>
    </div>
  );
}

这是在我较旧的项目上进行的工作，旧项目与新项目的唯一区别是react-scripts版本。

我的新项目依赖项：

 "dependencies": {
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "3.0.0"
  }

我以前的项目依赖项：

 "dependencies": {
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "2.1.8"
  },

react-scripts v3中有什么改动吗？

Answer 1

要使用CSS模块，您应该将文件命名为[name].module.css：

该项目使用[name].module.css文件命名约定在常规样式表的旁边支持CSS模块。 CSS模块通过自动创建格式为[filename]\_[classname]\_\_[hash]的唯一类名来对CSS进行范围界定。