mac下使用webstorm监听less文件自动生成wxss文件

vscode可以使用 Easy LESS 插件实现通用的功能。

本机环境:

  • 14.7.2 [macbookpro m3pro]
  • WebStorm 2024.1.1
  • nvm [v16.20.2]

步骤:

  1. 全局安装 less,这里使用 3的版本 [注意:nvm管理,切换的时候,需要重新安装!]
bash 复制代码
npm uninstall -g less && npm install -g less@3.13.1
  1. 打开 WebStorm 的 File Watcher

    ● 打开 WebStorm 设置(Cmd + , 或 File > Settings)。

    ● 找到 File Watchers(Tools > File Watchers)。

    ● 点击 + 添加新的 Watcher,选择 Less。

  2. 配置 File Watcher

    在新建的 Less Watcher 里,修改如下配置:

    ● File type: Less

    ● Scope: Project Files

    ● Program: 填写 Less 运行路径,通常是:

    ○ lessc(如果是全局安装)

    ○ 或者填写项目中的 Less 位置,例如:node_modules/.bin/lessc

    ● Arguments: 修改为:

bash 复制代码
  $FileName$ $FileNameWithoutExtension$.wxss

● Output Paths:

bash 复制代码
$FileNameWithoutExtension$.wxss

● Working directory: $FileDir$(保持默认)

相关推荐
vooy pktc30 分钟前
macOS安装Redis
数据库·redis·macos
A懿轩A36 分钟前
Ghostty:告别 Mac 毛坯终端,打造 2026 最丝滑的 Ghostty AI 开发驾驶舱——Claude Code 团队也在用
python·macos·策略模式
空中海2 小时前
01. iOS 逆向基础、环境搭建与授权
macos·ios·cocoa
空中海2 小时前
iOS LLDB 调试、Mach-O、Runtime 与二进制分析
macos·ios·cocoa
空中海2 小时前
iOS 防护、加固复测与综合交付
macos·ios·cocoa
生而为虫1 天前
Claude Code 最新版安装教程(Windows/Mac/Linux 全平台) 面向普通用户的 Claude Code 安装与模型接入指南
linux·windows·macos
李老师的Java笔记1 天前
如何解决Mac升级完nodejs没有生效的问题?
macos
开开心心_Every1 天前
轻量级PDF阅读器,仅几M大小打开秒开
linux·运维·服务器·安全·macos·pdf·phpstorm
Chengbei111 天前
轻量化 Web 安全日志分析神器 星川智盾日志威胁检测、地理溯源、MITRE ATT&CK 映射,支持 Windows/macOS/Linux
前端·人工智能·安全·web安全·macos·系统安全·安全架构
生而为虫1 天前
在VScode中使用Claude Code agent并配置模型(仅mac电脑实际操作,windows电脑未实际操作如有问题可留言)
windows·vscode·macos