我可以在开发工具中看到我的.scss文件，但不能在我的文本编辑器

Question

我正在使用Bootstrap模板来处理项目。我注意到当我打开模板index.html文件时，我可以在scss文件夹中看到更多文件夹。但是，在我的文本编辑器（VSC）中，我只能看到一定数量的scss文件。 有谁知道是什么原因引起的？ 我能够在浏览器中进行临时更改，但我无法保存更改，因为文件未出现在我的VSC中。 我在下面插入了我的问题的截图。第一个图像来自浏览器中的Dev工具，第二个图像是我在测试编辑器中看到的图像。 enter image description here。 enter image description here

Answer 1

为了提供更详细的解决方案，我必须看看哪个＆＃34;模板＆＃34;您正在使用。这是基于official Bootstrap theme还是第三方主题？

Chrome开发者工具使用源映射，因此如果sass文件引用第三方代码（如@import npm_modules/bootstrap/_alerts.scss），则它将遵循路径并显示引用的文件。

第一张图片（chrome developer tools）似乎引用了随模板打包的下载的Bootstrap源代码。如果是这种情况，您可以global search in VSC查找文件。

找到原始文件后，您应将其导入_bootstrap-overrides.scss文件，而不是编辑模板的原始源代码。