Visual Studio Community 2022中SCSS(Sass)如何展开对应CSS

我是SCSS初学者，目前正在开发Bootstrap5项目，已可正常访问项目内所有SCSS文件，但始终无法找到展开对应CSS代码的功能入口（界面未提供相关可用超链接），以下为其中一个SCSS文件的界面截图：

你现在打开的是未经过编译的原始SCSS源文件，SCSS是CSS预处理器语言，本身不会直接存储编译后的原生CSS代码，普通文件预览界面也没有内置SCSS实时编译功能，自然找不到展开CSS的入口，按下面的方式操作就能拿到对应CSS：

• 本地Bootstrap5项目自带完整的SCSS编译能力，先在项目根目录执行npm install安装所有项目依赖，再运行npm run css-compile脚本，所有SCSS文件编译完成后会统一输出到dist/css路径下，打开对应位置的.css文件就能看到完整的原生CSS代码。
• 如果只需要查看某段SCSS实际生效的CSS效果，不需要看全量编译文件：在项目的SCSS入口文件（一般是bootstrap.scss或者你自定义的custom.scss）里引入你要查看的SCSS模块，启动本地开发服务后打开浏览器开发者工具，选中对应DOM元素，右侧样式面板展示的就是实际生效的编译后CSS，还能直接定位到对应SCSS源码的行号。
• 不要在原始SCSS源码文件里找CSS展开入口，SCSS文件本身只存预处理器语法，所有最终生效的CSS都必须经过编译步骤才会生成。

如果你是直接下载的Bootstrap5源码压缩包，没有执行npm依赖安装步骤，是不会自动生成编译后的CSS文件的，必须先走完安装、编译流程才能看到对应内容。

内容的提问来源于stack exchange，提问作者Dana7371