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

成功

相关推荐
panda49199 小时前
css主流布局
前端·css
合作小小程序员小小店10 小时前
web网页开发,在线%医院诊断管理%系统,基于Idea,html,css,jQuery,java,jsp,ssh,mysql。
java·前端·css·数据库·jdk·html·intellij-idea
软件技术NINI10 小时前
html css js网页制作成品——html+css+js5 页 jk制服附源码
javascript·css·html
重铸码农荣光13 小时前
从 0 到 1 实现 LocalStorage 待办清单:CSS 进阶 + 前端工程化思想实践
css·前端工程化
凌波粒17 小时前
CSS基础详解(1)
前端·css
YuforiaCode18 小时前
2025版最详细WebStorm下载安装教程(详细图解)
ide·webstorm
yqcoder1 天前
在 scss 中,&>div 作用
前端·css·scss
小马哥编程1 天前
这个variables.scss文件中$menuText:#bfcbd9;:export {menuText: $menuText; }的语法符合要求吗
前端·css·scss
爆浆麻花1 天前
为什么有些人边框不用border属性
前端·css
www_stdio1 天前
用 localStorage 打造本地待办清单:一个轻量级的前端实践
javascript·css·json