如果 css 模块名称等于反应组件名称，则 css 模块不起作用

Question

文件结构：

src/
--- DatePicker/
--- --- index.js
--- --- style.module.scss

style.module.scss

.DatePicker {
  background: black;

  input {
    background: red;
  }
}

index.js

import React from 'react';
import CSS from "./style.module.scss";

export const DatePicker =(...props) => {
    return (
        <div className={CSS.DatePicker }>
                <input ref={inputRef}
                       type="text"
                       value={formattedDate}/>
        </div>
    )
};

构建无误。 Class 名称未添加到 DOM。

如果将 css 模块重命名为 "asdasd" 一切正常

Answer 1

将 "DatePicker" 重命名为 "datePicker"。 CSS 模块不支持大写。

如果 css 模块名称等于反应组件名称，则 css 模块不起作用

If css module name equals react component name then css module not work

javascript

css-loader