我正在做一个项目，我需要使用Bootstrap以及许多自定义CSS文件。到目前为止，我一直在我的index.html文件中直接导入Bootstrap的CSS，如下所示:
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x"
crossorigin="anonymous"
/>
但现在我需要导入Bootstrap CSS从我的node_modules所以我已经尝试导入它在我的index.css文件，像这样:
@import "bootstrap/dist/css/bootstrap.min.css";
它正在"工作"。但是现在，所有的Bootstrap CSS声明，包括它的重启，都覆盖了我自己的自定义CSS(在那之前不是这样的)。
所以我的问题是:有没有办法导入本地版本的Bootstrap的CSS，而不让它接管我的自定义CSS文件?
我在这里看到了一个解决方案，但是在我的许多文件中的所有CSS声明中添加自定义主体id看起来有点太多了。
你可以在你的'custom. CSS '之前导入bootstrap.min.css，这样它就不会覆盖你的自定义CSS。
解决方案是将bootstrap.min.css复制到公共文件夹中并将其导入到我的index.html文件中。出于某种原因，我第一次试的时候没有成功。作为参考，导入是这样完成的:
<link
href="css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x"
crossorigin="anonymous"
/>