1. webstrom打开多个项目

默认情况下一次只能打开一个项目，如果需要打开多个就按照下面的方法：

Preferences -> Directories -> Add Content Root

添加你需要的工程目录。

2. 编译Less Sass Scss

https://www.jetbrains.com/help/webstorm/compiling-sass-less-and-scss-to-css.html

http://www.jianshu.com/p/33c292578c9b

3.编译 PostCss

Node 全局安装 postcss,postcss-cli,postcss-cssnext,cssgrace

安装postcss插件

>npm install -g postcss

安装postcss-cli命令行插件

>npm install -g postcss-cli

安装postcss-cssnext插件(核心:包括浏览器前缀等)

>npm install -g postcss-cssnext

安装cssgrace(IE浏览器兼容插件)

>npm install -g cssgrace

在Webstorm 下安装postcss插件

Preferences | Plugins – just search for PostCSS.

在Webstorm中添加postcss外部工具

Preferences | Tools | External Tools + 

  • Name: 可以自己定义

  • Program:填入你的postcss-cli 的PATH   可用 which postcss 命令查看路径

  • Parameters: -u postcss-cssnext -o $FileDir$/$FileNameWithoutExtension$.css $FileDir$/$FileName$

　　   将 $FileDir$/$FileName$ 用postcss-cssnext 这个插件转换输出到 $FileDir$/$FileNameWithoutExtension$.css 中

　　　可以根据你自己的需要配置编译后的文件路径，具体参见https://github.com/code42day/postcss-cli

  • Working directory: $ProjectFileDir$

配置好后，在pcss文件上右键，在右键菜单中点击External Tools – postcss，即可编译。

右键不方便的话，可以设置个快捷键，打开Webstorm设置，Preferences -> Keymap ， 搜索External Tools ， 配置 postcss 即可。 不与原来的命名冲突就可以了。

参考网站：http://www.css88.com/archives/5670

webstorm 使用指南的更多相关文章

  1. Webstorm常用快捷键备忘(Webstorm入门指南)

    WebStorm 是jetbrains公司旗下一款JavaScript 开发工具.被广大中国JS开发者誉为“Web前端开发神器”.“最强大的HTML5编辑器”.“最智能的JavaSscript IDE ...

  2. 工程和界面—Webstorm入门指南 Webstorm中的工程-备

    1.新建工程 “Quick Start”界面新建工程: 也可以点击顶部菜单栏“File”-> “New Project”. 弹出如下界面: “Location”指向想要创建的工程目录(如果该目录 ...

  3. 常用快捷键—Webstorm入门指南

    提高代码编写效率,离不开快捷键的使用,Webstorm拥有丰富的代码快速编辑功能,你可以自由配置功能快捷键. 快捷键配置 点击“File”-> “settings” Webstorm预置了其他编 ...

  4. Webstorm10.0.3破解程序及汉化包下载、Webstorm配置入门指南

    核心提示: WebStorm 是jetbrains公司旗下一款JavaScript 开发工具.被广大中国JS开发者誉为“Web前端开发神器”.“最强大的HTML5编辑器”.“最智能的JavaSscri ...

  5. WebStorm破解方法

    http://www.jianshu.com/p/85266fa16639 http://idea.lanyus.com/ webstorm 入门指南 破解方法 1. 下载的WebStorm http ...

  6. 常用快捷键—Webstorm

    常用快捷键—Webstorm入门指南 提高代码编写效率,离不开快捷键的使用,Webstorm拥有丰富的代码快速编辑功能,你可以自由配置功能快捷键. 快捷键配置 点击“File”-> “setti ...

  7. WebStorm编辑器

    Webstorm的安装和免费使用 IntelliJ IDEA 注册码 (webstorm注册码):http://idea.lanyus.com/ (已经不能获取注册码了,之前的注册码可以重复使用) 安 ...

  8. Webstorm常用快捷键备忘

    WebStorm 是jetbrains公司旗下一款JavaScript 开发工具.被广大中国JS开发者誉为“Web前端开发神器”.“最强大的HTML5编辑器”.“最智能的JavaSscript IDE ...

  9. nodejs + socket.io + redis 新手上路

    最近要更新网站架构了,决定转入 nodejs + socket.io + redis 方式. 战斗刚开始: 网上的文章太松散,我根据各个网友的分享进行整理 ,让大家可以方便上手. 进入node.js之 ...

随机推荐

  1. MySql 中锁的定义

    行级锁,一般是指排它锁,即被锁定行不可进行修改,删除,只可以被其他会话select.行级锁之前需要先加表结构共享锁. 表级锁,一般是指表结构共享锁锁,是不可对该表执行DDL操作,但对DML操作都不限制 ...

  2. 怎样使用 v-for ?

    v-bind / v-on / v-if / v-for , 这四个指令应该是 vue 里面最常用的了, 之前已经简单记录的前三个的使用方法, 接下来就记一下 v-for 的基本用法. 1. v-fo ...

  3. HTML——form表单中常用标签 form input (text hidden password radio checkbox reset submit ) select(option)总结

    <form action="" method="get"> <!-- placeholder="请输入文本" 显示提示 r ...

  4. C#开发微信公众平台-就这么简单(转载)(附原文链接)

    一直使用的是一百八的诺鸡鸭,没有想去接触看起来风风火火的移动互联网:但因工作需要维护一个微信公众订阅号,考虑以前有做网站的基础,就想着做个简单的微信后台管理:看了官方的开发文档,比狗哥地图的短许多,又 ...

  5. windows server12 FTP 创建后常见问题

    一:用administrator 关闭防火墙可以访问,但是开启后不能访问 今天在windows server 2008 R2上安装了FTP,安装过程如下,然后添加内置防火墙设置,设置后发现本地可以访问 ...

  6. bash 中 () {} [] [[]] (()) 的解释

    bash 中 () {} [] [[]] (()) 的解释 来源  https://www.cnblogs.com/fhefh/archive/2011/04/16/2017895.html bash ...

  7. 用Fiddler模拟低速网络环境【转】

    原文链接:http://caibaojian.com/fiddler.html 我们为什么要限速 限速对于web前端研发是非常重要的,由于开发者的机器一般配置都很高,并且是在localhost下来调试 ...

  8. Java虚拟机-------垃圾回收机机制

    概述 jvm中的堆图 在了解 垃圾回收器 之前,首先得了解一下垃圾回收器的几个名词. 1. 吞吐量CPU 用于运行用户代码的时间与 CPU 总消耗时间的比值.比如说虚拟机总运行了 100 分钟,用户代 ...

  9. 小程序API接口调用

    1.在config.js中写入api接口及appkey   2.在HTTP.js中引入config.js,然后新建HTTP.js,在里进行wx.request的封装. 定义一个HTTP的类,来类里定义 ...

  10. Hyperledger Fabric（5）ChainCode的编写步骤

    链码(chaincode) 会对 Fabric应用程序  发送的交易做出响应,执行代码逻辑,与 账本 进行交互. 再复习下他们之间的逻辑关系: Hyperledger Fabric 中,Chainco ...