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$(保持默认)

相关推荐
一勺菠萝丶10 小时前
macOS 终端配置全攻略:zsh、bash_profile、zprofile、zshrc 到 nvm 配置的完整科普
macos·bash·策略模式
2501_9159090617 小时前
iOS 应用上架全流程解析,苹果应用发布步骤、ipa 上传工具、TestFlight 测试与 App Store 审核经验
android·macos·ios·小程序·uni-app·cocoa·iphone
Jouzzy17 小时前
【iOS安全】iPhone X iOS 16.7.11 (20H360) Palera1n MacOS版 越狱教程
macos·ios·iphone
wyzqhhhh1 天前
less和sass
前端·less·sass
@@神农1 天前
maven的概述以及在mac安装配置
java·macos·maven
不老刘1 天前
macOS/Linux ClaudeCode 安装指南及 Claude Sonnet 4.5 介绍
linux·macos·ai编程·claude·vibecoding
醉、倾城2 天前
面向开发人员的macOS入门教程
macos·策略模式
2501_916013742 天前
iOS 26 系统流畅度检测 从视觉特效到帧率稳定的实战策略
android·macos·ios·小程序·uni-app·cocoa·iphone
游戏开发爱好者83 天前
iOS 26 崩溃日志深度解读,获取方式、系统变动、定位策略
android·macos·ios·小程序·uni-app·cocoa·iphone
StrongerIrene3 天前
mac 安装npm之后,其他终端无法访问
macos