`
切切克闹
  • 浏览: 15677 次
社区版块
存档分类
最新评论

webstorm增加less开发插件

阅读更多

less大家都知道是什么了,现在比较流行的编译器就是koala nodejs来解决。koala就不多说了 好用也简单 只是换项目之后配置一下就行,今天我就讲下用 Nodejs 怎么来编译,我下面说的是针对 webstorm配合。

1,下载nodejs,并且安装,配置下环境变量。



 安装成功结果

2,安装less

在cmd中输入

npm install less -g

 

 less安装结果,记一下那个路径,后面会有用。

3,在webstorm里面配置less.

打开webstorm——File——Settings——Tools——File Watchers,点那个绿色的+ 按钮


  我解释下上面的内容。
program : 选择node.exe所在的目录

Arguments: 选择之前记录的那个目录下 lessc 文件所在的路径, 后面加$FileName$,

Working directory:不用改

Output...:就是指编译后css的存放路径,后面有个insert..的按钮,自己摸索吧,这个地方就是设置编译后的css文件存放的路径以及取什么名字以及后缀。我就不多说了,大家自己玩玩就知道了。

 

谢谢大家

  • 大小: 8.5 KB
  • 大小: 122 KB
  • 大小: 33.4 KB
0
3
分享到:
评论
1 楼 杨羊羊19911019 2015-12-01  
你好,在webstrom中安装好less后怎么将.less编译成.css呢?
 

相关推荐

    详解在WebStorm中添加Vue.js单文件组件的高亮及语法支持

    总的来说,要充分利用WebStorm的Vue.js开发环境,需要安装合适的插件并进行适当的设置调整。虽然存在一些限制,但通过上述步骤,你可以显著提高代码编辑体验,使其更接近于专门为Vue.js设计的IDE。不断更新和优化你...

    webstorm-setting

    3. **File Watchers**: 这是WebStorm的一个特性,允许用户配置外部工具,如自动化构建脚本或者预处理器(如Sass、Less或Babel)。File Watchers会在保存文件时自动运行这些工具,实时更新编译后的代码。 4. **...

    vuejs如何配置less

    在WebStorm中配置LESS插件 如果你使用WebStorm作为IDE,你可以按照以下步骤配置LESS支持: 1. 打开WebStorm,选择`File` -> `Settings`。 2. 在设置界面,找到`Tools` -> `File Watchers`。 3. 点击`+`按钮,选择`...

    Intellij-IDEA-F2E:Intellij IDEA PHPStorm WebStorm前端工程师指南(中文)

    WebStorm针对前端开发集成了一些比较常用的例如node.js LESS之类,性能好速度快PHPStorm针对PHP也做了一些优化,并包含了WebStorm IntelliJ IDEA则通过插件形式集成上面的某些功能,并且是主力JAVA IDE,功能强,...

    前端开发规范手册合集.zip

    推荐使用VS Code、WebStorm等专业IDE,并安装相应的插件来提高开发效率,保持代码风格一致性。 6. **技术开发全面的规范手册**:除了以上各点,还可能包括版本控制(如Git的使用)、测试规范、文档编写、性能优化、...

    JavaScript开发工具 共享

    例如,VS Code(Visual Studio Code)是一款非常流行的免费编辑器,支持多种语言,并拥有丰富的插件生态系统,能够满足不同开发需求。除此之外,Sublime Text和Atom也是备受欢迎的轻量级编辑器。 2. **IDE(集成...

    关于开发技术的WebStrom

    WebStorm是一款由JetBrains公司推出的专为JavaScript开发设计的集成开发环境(IDE),尤其受到前端开发者青睐。它以其丰富的特性和高效的工作流闻名,被誉为前端开发的利器。下面将详细介绍WebStorm的一些主要功能和...

    WebStormChineseLanguagePack中文语言包

    安装过程中,一般会涉及修改WebStorm的配置文件或通过内置的插件市场进行安装。 总的来说,WebStorm中文语言包是为中国开发者量身定制的,旨在提供一个更加友好、易用的工作环境。结合其强大的JavaScript和CSS开发...

    李森林-前端开发工程师.docx

    他具备扎实的计算机科学与技术专业背景,毕业于厦门华夏学院,专业技能涵盖JavaScript(包括ES6)、HBuilder、WebStorm、微信小程序开发工具等。此外,他还熟练运用Vue、Bootstrap、Vant和Element等框架,以及Vue-...

    wedStorm11.0.3

    8. **插件生态**:WebStorm 的插件系统丰富多样,允许用户根据自己的需求安装和配置各种插件,扩展其功能,如Prettier用于代码格式化,ESLint用于代码质量检查等。 9. **代码格式化和风格指南**:WebStorm 可以按照...

    前端开发软件安装包-最新.zip

    它拥有丰富的扩展插件库,可以自定义配置以适应各种开发需求,如代码片段、调试工具等。 3. **Node.js**:Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,它允许开发者在服务器端运行 JavaScript 代码...

    IDEA教程.doc

    JetBrains 还开发了一系列针对不同编程语言和平台的其他工具,如 WebStorm(前端开发)、Android Studio(Android 应用开发)、PhpStorm(PHP 开发)、RubyMine(Ruby 开发)、PyCharm(Python 开发)以及 CLion(C/...

    JavaScript_用于vjs开发的基于webpack的工具.zip

    9. 开发工具:熟悉Git进行版本控制,使用npm或yarn管理依赖,以及VSCode、WebStorm等IDE进行开发。 10. 持续集成/持续部署(CI/CD):了解Jenkins、Travis CI或GitHub Actions等工具,实现自动化测试和部署。 通过...

    模板代码模板代码

    2. IDE或代码编辑器插件:许多开发环境支持自定义代码片段,例如Visual Studio Code的Snippets,Sublime Text的Package Control。 3. 预处理器:在CSS中,Sass和Less允许创建变量和嵌套规则,形成模板化的样式代码。...

    前端开发需要用到的工具

    - **Visual Studio Code (VS Code)**:由微软开发的轻量级但功能强大的源代码编辑器,支持多种语言,拥有丰富的扩展插件,是前端开发者首选的编辑器之一。 - **Sublime Text**:以其快速启动和高效性能闻名,支持...

    浅谈css3中calc在less编译时被计算的解决办法

    值得注意的是,在某些集成开发环境(IDE)中,比如Webstorm,可能会对这种写法报语法错误的提示,但编译过程仍然能够成功完成。 此外,作者提到的工具网站(***)提供了一些格式化及净化CSS及其他语言的功能,这...

    前端研发工具篇

    WebStorm是JetBrains公司的JavaScript开发工具,内置了对ES6的支持、代码高亮、Emmet、CSS预处理器等特性。由于其与IntelliJ IDEA的同源关系,WebStorm继承了强大的JS功能,被誉为“Web前端开发神器”。 5. Atom ...

Global site tag (gtag.js) - Google Analytics