如何在 vscode 或浏览器开发工具中查看 Scss 的 @debug 结果？

Question

How can I watch @debug result in scss?

I'm using the Live Sass Compiler by Glenn Marks in VSCode. Is there a way I can see the debug output in the terminal or chrome console?

Code example:

@debug 'hello world';
@debug math.div(10, 3);

Answer 1

Yes, you just need to set showOutputWindowOn to Debug . You can see details in the settings

Answer 2

More specifically ( as from another answer pointed out ); (in multiple diff ways)::

• |-| ctrl+shift+p > Preferences: Open Settings (UI) ( workbench.action.openSettings2 ) > Workspace > Live Sass Compile > Settings: Show Output Window On > Debug

• |-| ctrl+shift+p > Preferences: Open Workspace Settings (JSON) ( workbench.action.openWorkspaceSettingsFile ) > paste "liveSassCompile.settings.showOutputWindowOn": "Debug"

• |-| ctrl+shift+p > exec liveSass.command.showOutputOn.debug

• |-| (or you may use comments as an output, as a workaround...)

Reference::

answer above

https://github.com/glenn2223/vscode-live-sass-compiler/blob/master/docs/settings.md#livesasscompilesettingsshowoutputwindowon

https://github.com/glenn2223/vscode-live-sass-compiler/blob/master/docs/settings.md#livesasscommandshowoutputon

https://github.com/ritwickdey/vscode-live-sass-compiler/issues/234#issuecomment-762474594 (outdated?)