WebStorm配置less编译wxss或css

文章目录


前言

使用WebStorm写微信小程序,wxss写着很麻烦,就想着用less,接下来是配置less编译


先下载安装less

javascript 复制代码
npm install -g less

less会安装在你当前目录下(以D盘为例),不过,可执行文件在这里:

可执行文件在这里(.bin目录,路径有圆点符号)

D:\node_modules.bin\lessc.cmd

打开webstorm的file watchers

具体目录: file(文件)->settings(设置)->Tools(工具)->file watchers

只需要改动以下三部分就行了(下方有图)

程序:

我的在D盘,一般都在项目的node_modules目录下的.bin\lessc(记住是.bin目录)

D:\project\huanjing-mp-new\node_modules.bin\lessc

实参:

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

要刷新的输出路径

javascript 复制代码
$FileNameWithoutExtension$.wxss

以上三步没问题,就ok了,编译css也是同理,只是将wxss后缀名改为css就行。

成功

相关推荐
wordbaby12 小时前
Flexbox 布局中的滚动失效问题:为什么需要 `min-h-0`?
前端·css
前端小黑屋13 小时前
查看 Base64 编码的字体包对应的字符集
前端·css·字体
hqwest15 小时前
码上通QT实战04--主窗体布局
开发语言·css·qt·布局·widget·layout·label
狗哥哥18 小时前
企业级 Vue3 + Element Plus 主题定制架构:从“能用”到“好用”的进阶之路
前端·css·架构
hqwest18 小时前
码上通QT实战05--绘制导航按钮
开发语言·css·qt·自定义控件·qframe·布局ui
lcc18719 小时前
CSS3 响应式布局
css
咬人喵喵19 小时前
16 类春节核心 SVG 交互方案拆解(E2 编辑器实战)
前端·css·编辑器·交互·svg
winfredzhang19 小时前
[全栈实战] 从零打造一个“沉浸式”私人云端阅读器 (Node.js + EPUB.js)
javascript·css·node.js·html·extjs·epub阅读器
星辰也为你祝福h19 小时前
前端面试题-CSS篇
前端·css
hxjhnct20 小时前
CSS的模块化
前端·css