为什么创建反应应用程序不导入 css 文件？

Question

[在此处输入图片描述][1]问题：output 中没有 CSS。

尝试修复的方法：

1. 将styles.css 8CBA22E28EB17B5F5C6AE2A266AZ 重命名为styles.module.css -- 失败
2. 在终端中手动加载 Webpack 即使它不应该使用create-react-app需要它——失败
3. 尝试了语法 - 从./styles.module.css ； - 也只是import./styles.module.css ； 并import styles.module.css ； - 失败

所以我已经搜索了几个小时，但似乎没有任何效果。 链接提供了什么代码。 当它运行时，终端清楚地显示第 4 行已定义但从未使用过，这从 Visual Studio 代码中的灰色行可见。

https://i.stack.imgur.com/X4PdW.png https://i.stack.imgur.com/cdKYB.png

我很感激任何帮助。 先感谢您

Answer 1

我看到你所做的是import styles from "./styles.module.css"但没有使用styles

除了import "./styles.module.css" ，不确定这是否会正常工作，因为您的 styles 将被限定。 （这我没有测试它只是假设）

这是来自创建反应应用程序文档

import React, { Component } from 'react';
import styles from './Button.module.css'; // Import css modules stylesheet as styles
import './another-stylesheet.css'; // Import regular stylesheet
class Button extends Component {
  render() {
    // reference as a js object
    return <button className={styles.error}>Error Button</button>;
  }
}

如果在 styles 的文件名中添加模块。

使用import styles from './Button.module.css'; 然后使用styles访问文件中的内容，例如styles.[class-name-from-Button.module.css]

如果您只有Button.css只需调用import './Button.css'; 在顶部的某个地方，不要在 Button 和 css 之间添加模块