时间戳

首页 > 解决方案 > 正在从组件中未导入的文件中读取 CSS 类

css - 正在从组件中未导入的文件中读取 CSS 类

问题描述

我对 CSS 文件和导入它们有一个奇怪的问题。我有一堆 .jsx 文件和我的 react 组件，每个文件都有单独的 .css 文件用于样式设置。问题是，在某些情况下，当我在某些 ex_file.jsx 中执行此操作时

import './ex_file.css';
import React from 'react';

然后尝试使用导入的类

<div className="example-class">
  Some text
</div>

应用的类不是来自在 .jsx 文件顶部导入的 .css 文件。这是预期的行为吗？从我搜索的内容来看，没有提到这一点。显然，我可以为每个 css 类赋予唯一的名称，但我想知道是否有办法解决这个问题。

标签： cssreactjs

解决方案

应用的类不是来自在 .jsx 文件顶部导入的 .css 文件。这是预期的行为吗？

是的，因为在任何导入文件中定义的 CSS 规则都没有明确限定在它们的组件范围内。

显然，我可以为每个 css 类赋予唯一的名称，但我想知道是否有办法解决这个问题。

手动提供唯一名称是解决此问题的一种方法。但是你可以使用CSS Modules 之类的东西。

推荐阅读