Stylus
GoLand 可即时将您的 Stylus 代码转译为 CSS。
开始之前
请确保您的计算机上已安装 Node.js。
按照 从 JetBrains Marketplace 安装插件中的说明,在 设置 | 插件 页的 Marketplace 标签中安装并启用 Stylus 插件。
请确保在设置中启用了 File Watchers 插件。 按 Ctrl+Alt+S 打开设置,然后选择 。 点击 已安装 标签。 在搜索字段中,输入 File Watchers。 如需了解有关插件的详细信息,请参阅 管理插件。
安装 Stylus
在嵌入的 终端 (Alt+F12 )中,键入:
npm install --global stylus请访问 Stylus 官方网站了解更多信息。
编译 Stylus 代码
要实现代码的自动编译,您需要安装编译器并配置 Stylus File Watcher ,以便跟踪文件更改并运行编译器。
打开文件时,GoLand 会检查当前项目中是否存在可用的 File Watcher。 如果已配置但处于禁用状态,GoLand 将显示一个弹出窗口,告知您已配置的 File Watcher 并建议启用它。
如果当前项目中已有可用的 File Watcher 并已启用,GoLand 会在 新建 Watcher 对话框中指定的事件发生时自动启动编译器。
如果选中了 自动保存已编辑的文件以触发监视器 复选框,则在对源代码进行任何更改时立即调用 File Watcher。
如果取消选中 自动保存已编辑的文件以触发监视器 复选框,则在保存(、 Ctrl+S )或切换出 GoLand 时(失去焦点)启动 File Watcher。
请参阅 文件监视器 以了解更多信息。
GoLand 会创建一个包含生成输出的独立文件。 该文件名称与源 Stylus 文件相同,但扩展名为 .css 。 生成文件的位置在 要刷新的输出路径 字段中指定,该字段位于 新建 Watcher 对话框内。 但在 项目树 中,它们显示在源文件节点下。
创建 File Watcher
在 设置 对话框(Ctrl+Alt+S )中,点击 文件监视器 ,位于 工具 下。 打开的 File Watchers 页面将显示已配置的 File Watcher 列表。
点击
或按 Alt+Insert ,然后从列表中选择模板 Stylus。
在 程序 字段中,指定可执行文件的路径:
stylus (适用于 macOS 和 Unix)。
stylus.bat (适用于 Windows)。
手动输入路径,或点击
,在打开的对话框中选择文件位置。
请按照 文件监视器 中所述继续完成操作。
配置语法高亮
您可以根据自己的喜好和习惯配置 Stylus 的语法高亮。
在 设置 对话框(Ctrl+Alt+S )中,转到 。
选择颜色方案,接受从默认值继承的高亮设置,或按照 颜色与字体 中的说明自定义设置。
配置代码风格
按 Ctrl+Alt+S 打开设置,然后选择 。
使用控件配置 Stylus 文件中的代码风格。