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 [email protected]
  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$(保持默认)

相关推荐
Alger_Hamlet8 小时前
Final Cut Pro X for Mac fcpx音视频剪辑编辑
macos
小雅痞9 小时前
[Mac]利用Hexo+Github Pages搭建个人博客
macos·hexo·github.io
coding随想9 小时前
macOS (M1 Pro) 上 Docker Desktop 安装失败问题及其解决方案
macos·docker·容器
热爱编程的小曾12 小时前
sqli-labs靶场 less 7
android·adb·less
coding随想14 小时前
解决 macOS (M1 Pro) 上使用 Vite 进行 Build 打包时 Node 进程内存溢出的问题
macos·node.js
Tee xm16 小时前
清晰易懂的Rust安装与配置教程
linux·windows·macos·rust
Billy Qin17 小时前
【Mac】npm error Error: EACCES: permission denied, mkdir‘/Users/...
前端·macos·npm
马拉萨的春天2 天前
mac 下配置flutter 总是失败,请参考文章重新配置flutter 环境MacOS Flutter环境配置和安装
flutter·macos
yinshuilan2 天前
Tabby 一:如何在Mac配置保姆级教程(本地模型替换hugging face下载)
macos·ai编程·tabby·ai模型
米粒宝的爸爸2 天前
mac idea的快捷键
macos