PhpStorm配置less自动编译css

Less 是一门 CSS 预处理措辞,它扩展了 CSS 措辞,增加了变量、Mixin、函数等特性,使 CSS 更易掩护和扩展。
作为 CSS 的一种扩展,Less 不仅完备兼容 CSS 语法,而且连新增的特性也是利用 CSS 语法。
这样的设计使得学习 Less 很轻松,而且你可以在任何时候回退到 CSS...

less中文网:less中文网

phplessPhpStorm设置装备摆设less主动编译css Bootstrap

nodejs下载:nodejs

less利用可作为参考;

phpstorm配置支持less须要利用npm命令;

须要安装nodejs

本文在windows和mac下进行测试;

第一步:安装nodejs

点此nodejs下载,找到自己对应的版本;

点击下载;

按照提示一步一步安装即可;

第二步:npm安装less

在终端运行:

ps:以上命令操作你都可以在less中文网中找得到

然后重启编辑器;

如果不能正常运行以下步骤,那就重启电脑;

第三步:修正phpstorm配置

windows打开设置【setting】

mac找到首选项【Preferences】

打开之后,在左上角搜索框输入:file Watchers

new watcher对话框

之后会弹出new watcher对话框

点击ok

再点ok,把对话框全点没了;

然后你就可以新建文件index.less进行测试

如果新建文件上部弹出提示;

那就点击Add watcher添加监听;

每次书写,ctrl+s保存会自动编译css

【本文来自 武斌博客 http://www.wubin.pro,为超人原创文章,想获取更好的页面浏览效果或者有任何问题请进入博客,同时也可在博主评论区进行留言,让博主为大家答疑解惑~】