一、主题配色

主题设置
方法:File -> Settings -> Appearance & Behavior -> Appearance ->Theme.

webstorm-setting-02.jpg

配色设置
方法:File -> Settings -> Editor -> Colors & Fonts->Scheme.(注:如果你是从从Sublime text3转过来的朋友,比较偏好monokia配色的,可以参见此文 webstorm入门1-主题和配色

webstorm-setting-04.jpg

二、打开多个项目

WebStorm默认情况下一次只能打开一个项目,这点很不爽,其实是可以设置的。(注:如果你一开始就建了项目再来配置,记得要把左边显示的根路径移除,不然可能点击Add Content Root配置后也不一定能生效
方法:File -> Settings -> Directories -> Add Content Root 中添加你当前的工程目录。

webstorm-setting-01.jpg

三、配置webserver选项(端口)

方便其他ip设备访问(如手机等测试效果)
方法:File -> Settings -> Build,Execution,Development -> Debugger ->port

webstorm-setting-05.jpg

四、设置文件的默认编码

方法:File -> Settings -> Editor -> File Encodings -> IDE Encoding,Project Encoding.
(注:配置前和配置后都可以打开页面,在页面的右下角显示有编码,下面截图右下角就有)

webstorm-setting-06.jpg

五、快捷键配置

你可以使用默认快捷键配置,也可以根据自己的风格选择配置。习惯eclipse和myeclipse开发的可以配置成eclipse快捷键。
方法:File -> Settings -> Keymap-> Keymaps

webstorm-setting-07.jpg

六、emmet配置,语法等等

上面提到了快捷键,webstorm自带emmet插件。用过zen coding的人应该都知道,emmet就是zen coding的升级版。当然,webstorm也不是支持所有的emmet语法,不过够用了。可以参考此文Enabling Emmet Support看看具体情况。
如下图,可以看到css自动加浏览器厂商前缀。

webstorm-setting-08.png

七、行号,换行,参考线

打开页面后,右击页面左边边界,弹窗选项,根据自己需要勾选就是,如下图:

webstorm-setting-09.png

八、导入导出配置

当你需要在其他电脑的webstorm上也想用自己编码风格时,将配置文件导入重启webstorm即可生效。
导出方法:File -> Export Settings... ->自己选择选项和路径。用默认也可以。
导入方法:File -> Import Settings... ->选择.jar文件路径。

九、插件配置

webstorm自带很多插件,你可以根据自己需要配置。我暂时未使用,如果你用到了,可以参考下面的一些文章。

  1. SVN、Git插件配置,CSS预处理语言的预编译、JS 实时压缩等等可以参考此文webstorm入门2-配置
  2. 使用css预编译器(sass,less)的朋友,可以省掉gulp、grunt类前端辅助工具,参考此文webstorm入门5-sass、scss、less监听编译

参考:

WebStorm配置的更多相关文章

  1. Webstorm配置CSS/SCSS自动补全兼容前缀autoprefixer插件

    关于Autoprefixer Autoprefixer是一个后处理程序,不象Sass以及Stylus之类的预处理器.它适用于普通的CSS,可以实现css3代码自动补全.也可以轻松跟Sass,LESS及 ...

  2. webstorm配置编译sass的输出目录

    关于这个的问题,虽说不是很难,但还是踩了点小坑,下面就来介绍下如何使用webstorm配置编译sass的输出目录. 1.下载Ruby 2.使用Ruby安装sass 3.检测是否安装成功. 前面的几步很 ...

  3. webstorm配置eslint【标记错误,修复错误】

    项目中经常用到eslint语法,结合个人经验,用webstorm配置eslint "文件"->"默认设置"->"语言&框架&quo ...

  4. ruby安装及webStorm配置SCSS

    sass安装: 步骤:(window系统) 1.下载RubyInstaller(v2.4.3),运行安装,基本直接next安装,不过有个add to PATH的选项一定要勾选,这样就不用配置环境变量. ...

  5. WebStorm配置Node.js IDE

    开始刚学的时候一直用命令行来运行Node.js,网上找了些配置Node.js IDE配置的贴子,说WebStorm配置IDE最简单,自己就试了下. 1.首先安装Node这步就不说了 2.下载WebSt ...

  6. 【02】webstorm配置babel转换器+截图(by魔芋)

    [02]webstorm配置babel转换器+截图(by魔芋)   [02]魔芋的安装过程     01,配置babel.   02,用webstorm.注意webstorm的版本号.   03,使用 ...

  7. Webstorm配置运行React Native

    Webstorm配置运行React Native 1.选择配置 2.选择npm,设置package等参数 3.添加拓展工具 4.配置拓展工具(核心啊) 5.运行测试,ok的.

  8. webstorm 配置scss的问题

    第一种方法(ruby方法) 先安装ruby,在windows/system32目录下 1.先查询源是什么 gem sources 2.移除原有的源头 gem sources -r http://xxx ...

  9. Mac 下 WebStorm 配置go语言开发环境

    一.下载安装WebStorm,我的是 二.在WebStorm 中安装go插件 三.在本机安装go开发环境,直接装pkg文件,https://golang.org/doc/install 四.在WebS ...

随机推荐

  1. js ajax post 提交的时候后台接收不到参数,但是代码没有错,怎么回事

    这个错误有两点,你自己写的php页面里面的参数接收出错了 还有就是你没有写一句重要的代码告诉浏览器 你使用post提交方式去提交 xhr.setRequestHeader("Content- ...

  2. jrebel使用

    背景与愿景:开发环境下,tomcat对热布署的支持还不够全面,致使开发人员浪费大量时间在重起服务上.为了提高开发效率,决定引入Jrebel,它对热布署的支持相对比较全面.虽然Jrebel官方号称使用它 ...

  3. RPM 打包技术与典型 SPEC 文件分析

    一 .rpm 介绍 1. 概述 RPM全称是 Red Hat Package Manager(Red Hat包管理器).几乎所有的 Linux 发行版本都使用这种形式的软件包管理安装.更新和卸载软件. ...

  4. C#编程(八)--------- Main函数

    Main()方法. C#程序是以Main()开始执行的,这个方法必须是类或结构的静态方法,并且其返回类型必须是int或者void. 虽然显示指定public修饰符很常见,但是我们也可以把该方法标记为p ...

  5. cocos2d-x动画加速与减速

    动画是游戏的必定要素之中的一个,在整个游戏过程中,又有着加速.减速动画的需求.以塔防为样例,布塔的时候希望可以将游戏减速,布好塔后,则希望能将游戏加速:当某个怪被冰冻后,移动速度减缓,而其它怪的移动速 ...

  6. Java中间件:淘宝网系统高性能利器

    [TechTarget中国原创]淘宝网是亚太最大的网络零售商圈,其知名度毋庸置疑,吸引着越来越多的消费者从街头移步这里,成为其忠实粉丝.如此多的用户和交易量,也意味着海量的信息处理,其背后的IT架构的 ...

  7. android之使用mvn构建创造项目步骤

    转自:http://blog.csdn.net/luhuajcdd/article/details/8132386 手动的创建自己的android application   1.用android t ...

  8. android 内存溢出oom错误的一些小见解

    转:http://blog.csdn.net/xuhui_7810/article/details/9493681 我们在代码里调用setBackgroundResource(int resid)来设 ...

  9. [转]C++之多态性与虚函数

    面向对象程序设计中的多态性是指向不同的对象发送同一个消息,不同对象对应同一消息产生不同行为.在程序中消息就是调用函数,不同的行为就是指不同的实现方法,即执行不同的函数体.也可以这样说就是实现了“一个接 ...

  10. sqlalchemy批量删除数据、全量删除

    问题:sqlalchemy如何批量删除多条数据解决:使用参数synchronize_session=False,或for循环方法:        users = self.db.query(User) ...