如何将自定义外部css链接(如bootstrap css)包含到单个REACT组件



我想添加一个从bootstrap网站导入的自定义css,因为它不是一个可以在我的react组件中导入的css文件如何为React组件导入这种类型的css?

<link href="https://getbootstrap.com/docs/4.5/dist/css/bootstrap.min.css" 
rel="stylesheet" integrity="sha384- 
9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" 
crossorigin="anonymous">

如果您使用npm来管理React的依赖项,则可以添加Bootstrap作为依赖项并导入相关文件。

示例:

在命令行中(在package.json文件所在的目录内(:

npm install --save bootstrap

在组件代码中,您的其他导入在哪里(通常在脚本部分的开头(:

import 'bootstrap/dist/css/bootstrap.min.css'; 

这可能有一个警告:导入的样式可能与其他样式冲突,因此您可能必须确保这不会产生任何不利影响。

最新更新