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

成功

相关推荐
粉末的沉淀7 小时前
css:制作带边框的气泡框
前端·javascript·css
西游音月9 小时前
(4)pytest+Selenium自动化测试-元素定位之CSS Selector定位
css·selenium·pytest
谢尔登11 小时前
【CSS】样式隔离
前端·css
LQW_home19 小时前
前端展示 接受springboot Flux数据demo
前端·css·css3
WebGirl20 小时前
一个 CSS 属性aspect-ratio
css
xump21 小时前
如何在DevTools选中调试一个实时交互才能显示的元素样式
前端·javascript·css
Lhuu(重开版1 天前
CSS:动效布局动画
前端·css
不羁的fang少年1 天前
前端常见问题(vue,css,html,js等)
前端·javascript·css
yivifu1 天前
CSS Grid 布局详解(2025最新标准)
前端·css
姜太小白1 天前
【前端】CSS媒体查询响应式设计详解:@media (max-width: 600px) {……}
前端·css·媒体