我之前使用AngularJS,现在开始学习React。虽然Angular 1.x是基于组件的,但仍然有模板(template)的概念。在React中,文件结构和前端编码方式已经改变,例如将文件按组件拆分而不是按页面拆分。这鼓励代码的可重用性,但这是否意味着我们应该改变如何应用CSS呢?
我在navBar.jsx中看到了这个import { navBar } from 'styles/navbar.css'
。嗯,CSS是如何与JSX一起工作的呢?这个navBar CSS文件会被加载吗?需要哪些webpack插件?它们是默认安装的吗?我使用Facebook的react-create-app,所以不太熟悉配置。
css-loader
导入 CSS 文件及其依赖项(例如url
引用),并生成一个 CSS 字符串,然后在打包应用程序时,style-loader
将该字符串注入到您的 index.html 中。如果您的 CSS 没有引用其他资源,则可以使用raw-loader
替代css-loader
。但是,如果您希望样式被注入到 DOM 中,则需要使用style-loader
。 - Assan