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就行。

成功

相关推荐
曲幽1 小时前
手把手搞定FastAPI静态文件:安全、上传与访问
css·python·fastapi·web·js·favicon·staticfiles
韩曙亮6 小时前
【Web APIs】移动端轮播图案例 ( 轮播图自动播放 | 设置无缝衔接滑动 | 手指滑动轮播图 | 完整代码示例 )
前端·javascript·css·html·轮播图·移动端·web apis
PieroPc7 小时前
Html +css+js 写的一个小商城系统(POS系统)
javascript·css·html
OranTech7 小时前
练习06-CSS设置样式
css
幻影星空VR元宇宙15 小时前
飞行影院设备价格解析及性价比分析
css·百慕大冒险·幻影星空
cz追天之路20 小时前
华为机考 ------ 识别有效的IP地址和掩码并进行分类统计
javascript·华为·typescript·node.js·ecmascript·less·css3
霍理迪1 天前
CSS布局方式——定位
前端·css
灯把黑夜烧了一个洞1 天前
2026年跨年倒计时网页版
javascript·css·html·2026跨年代码·新年代码
铅笔侠_小龙虾1 天前
html+css 实现键盘
前端·css·html
韩曙亮1 天前
【Web APIs】移动端返回顶部案例 ( 返回顶部按钮 显示 / 隐藏 设置 | 返回顶部操作 )
前端·javascript·css·html·移动端·web apis·返回顶部