Javascript 如何导入CSS文件以响应JS应用程序？

我正在创建一个应用程序，创建了多个CSS文件，但这些文件无法导入

我尝试安装css加载器和样式加载器。但这没用

请看下面的图片，我有Burger.css文件。但它对导入不可见

---

好，既然您确认了导入的

/Layout.css

不起作用，就不应该在涉及css文件时命名导入。做：

import./myFile.css'

足够应用你的css了

请注意，css在React中是全局的，所以您可能希望使用
样式化组件
或封装css以防止对其他组件产生副作用）

现在，如果您真的想以您尝试的方式添加样式，那么有一个接受对象的
style
属性。所以你可以做：

你好，世界

请注意，css属性是在camelCase中编写的，在我看来，您的文件结构是

-Burger
--BurgerIngredient
----Burger.css
--Layout
----Layout.css

从这里显示的内容来看，您的主要应用程序位于
/Burger
中。考虑到这一点，当您键入import时，您会看到下拉列表出现，显示有用的建议，并列出

-../Burger/BurgerIngredient/...

作为一个可能的、有效的位置。在这种情况下，我们为什么不尝试导入css，通过键入

import burgercss from '../Burger/BurgerIngredient/Burger.css';

请注意，例如，
Burger.css
在您选择
Burger
之前不会显示，因为这是它的连接文件夹。
默认情况下，VS code不会自动完成所有文件类型。如果您在Layout.js文件中写入import./Burger/Burger.css或import./Burger/burgercomponent/burgercomponent.css，您的css文件将可以正常加载

如果要对VS代码中的所有文件使用自动完成，可以使用此扩展名


无延伸


延长

您的
从“./Layout.css”导入类是否有效？因为我认为你做不到。通常，您将按如下方式导入css文件：
import./Layout.css'
并将其应用于您的代码。不，它也不起作用@quentingriselw如果您实际键入全名，
。/Burger/burgercomponent/Burger.css
？有错误消息吗？@mynameisdd我的回答解决了你的问题吗？我想他在CSS导入中试图使用CSS模块。