PyCharm 2025.3 Help

Stylus

PyCharm 可让您实时将 Stylus 代码转换为 CSS。

开始之前

  1. 请确保您的计算机上已安装 Node.js。

  2. 在 设置 | 插件 页面、 Marketplace 选项卡上安装并启用 Stylus 插件，具体请参见 从 JetBrains Marketplace 安装插件。

  3. 请确保在设置中已启用 文件监视器 插件。 按下 Ctrl+Alt+S 打开设置，然后选择 插件。 点击 已安装 选项卡。 在搜索字段中，键入 文件监视器。 有关插件的更多信息，请参阅 管理插件。

安装 Stylus

  • 在嵌入的 终端 （Alt+F12 ）中，键入：

    npm install --global stylus

    详细了解请参阅 Stylus 官方网站。

编译 Stylus 代码

要自动编译代码，您需要安装编译器并配置一个 Stylus 文件监视器 ，它将跟踪文件的更改并运行编译器。

当您打开文件时，PyCharm 会检查当前项目中是否有可用的文件监视器。 如果已配置此类文件监视器但被禁用，PyCharm 会显示一个弹出窗口，告知已配置的文件监视器并建议启用它。

如果在当前项目中配置并启用了适用的文件监视器，PyCharm 会在 新建监视器对话框 中指定的事件发生时自动启动编译器。

  • 如果选中 自动保存已编辑的文件以触发监视器 复选框，则在对源代码进行任何更改后会立即调用文件监视器。

  • 如果清除 自动保存已编辑的文件以触发监视器 复选框，则在保存（文件 | 全部保存、 Ctrl+S ）或将焦点从 PyCharm 移开时（框架停用时）启动文件监视器。

详细了解请参阅 文件监视器。

PyCharm 会创建一个包含生成输出的单独文件。 该文件与源 Stylus 文件同名，扩展名为 .css 。 生成文件的位置在 新建监视器对话框 的 要刷新的输出路径 字段中定义。 但是，在 项目树 中，它们显示在源文件下方，源文件现在显示为一个节点。

创建文件监视器

  1. 在 设置 对话框（Ctrl+Alt+S ）中，在 工具 下，点击 文件监视器。 打开的 文件监视器页面 会显示已配置的文件监视器列表。

  2. 点击 添加按钮 或按 Alt+Insert ，然后从列表中选择 Stylus 预定义模板。

  3. 在 程序 字段中，指定可执行文件的路径：

    • stylus 适用于 macOS 和 Unix。

    • stylus.bat 适用于 Windows。

    手动键入路径，或点击 浏览按钮 并在打开的对话框中选择文件位置。

  4. 按 文件监视器 中的说明继续操作。

配置语法高亮显示

您可以根据个人偏好和习惯配置感知 Stylus 的语法高亮显示。

  1. 在 设置 对话框（Ctrl+Alt+S ）中，转到 编辑器 | 配色方案 | Stylus。

  2. 选择配色方案，接受从默认设置继承的高亮设置，或按照 颜色与字体 中的说明进行自定义。

配置代码风格

  1. 按下 Ctrl+Alt+S 打开设置，然后选择 编辑器 | 代码风格 | 样式表 | Stylus。

  2. 使用 代码风格。 Stylus 上的控件来配置 Stylus 文件中的代码风格。

最后修改日期： 2025年 12月 2日
StylelintTailwind CSS