没有为 NextJS 中的第二个容器加载 CSS 样式

Question

我有两个基本的 div 容器，我正在尝试对其应用一些样式。我确实从一个单独的 .module.css 文件中导入了我的 CSS 样式，并且第一个样式在分配时在 className 属性中被拾取。但是，同样的事情不适用于第二个 div。 'sales' 类的 css 属性没有被拾取

dashboard.js

import HomeSalesmanStyles from '../../../styles/SalesmanHome.module.css';

const HomeSalesman = ({name}) => {
  return(
    <>
      <div className={HomeSalesmanStyles.container}>
        <h4>
          Hello, {name} ???? 
        </h4>
      </div>
      <div className={HomeSalesmanStyles.sales}>
          Hello
      </div>
    </>
  )
};

export default HomeSalesman;

SalesmanHome.module.css

.container {
  display: flex;
  justify-content: center;
  margin-top: 5%;
};
.sales {
  display: flex;
  justify-content: center;
  width: 100px;
  background-color: red;
}

有什么想法吗？

----------- 编辑 ------------ 问题是错误的 css 模块名称导入！更正到正确的文件后，一切正常。

Answer 1

这看起来像是 CSS 中的语法错误：在规则后添加分号无效。

.container {
  display: flex;
  justify-content: center;
  margin-top: 5%;
} /* <- no semicolon */
.sales {
  display: flex;
  justify-content: center;
  width: 100px;
  background-color: red;
}

<div class="container">
  <h4>
    Hello, {name} ? 
  </h4>
  </div>
  <div class="sales">
      Hello
  </div>