javascript - 如何将自定义外部 css 链接（如 bootstrap css）包含到单个 REACT 组件中

Question

我想添加从引导网站导入的自定义 css，因为它不是我可以在我的反应组件中导入的 css 文件如何为 React 组件导入这种类型的 css？

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

标签： javascriptcssreactjs

Answer 1

如果您使用npmReact 管理依赖项，则可以将 Bootstrap 添加为依赖项并导入相关文件。

例子：

在命令行中（在您的package.json文件所在的目录内）：

npm install --save bootstrap

在组件代码中，您的其他导入（通常在脚本部分的开头）：

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

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