WebStorm jetbrains公司旗下一款JavaScript 开发工具。被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。与IntelliJ IDEliJ IDEA同源,继承了IntelA强大的JS部分的功能。

下面是我个人在使用这个软件的时候遇到的问题:

一:怎么改变字体大小

新建Scheme + 修改字体

ctrl+alt+s打开Settings界面,Editor > Colors&Fonts > Font。

Default scheme是亮色调,但我想定制一套暗背景的环境,所以在右侧Scheme name下拉框中选择Monokai,以此作为修改的基础,然后点击Save as,给自己新建的Scheme起个名字吧,如下图:

这里面可以设置字体(我一般选择Consolas),字体大小,行间距。

自定义语法高亮

用ctrl+alt+s打开Settings界面,Editor > Colors&Fonts。

不同语言有各自的语法高亮规则,但有一部分是通用的(General),我们首先来设置General,然后再根据需要设置不同语言的语法高亮。

General的设置

普通文本:default text

折叠文本: Folded text

光标: Caret

光标所在行: Caret row

行号: Line number

TODO: TODO default

光标下变量高亮:Search result

搜索结果:Text search result

匹配的括号:Matched brace

不匹配的括号:Unmatched brace

未使用的符号:Unused symbol

左边空隙(行号,断点):Gutter background

选中的文本背景色:Selection background

选中的文本前景色:Selection foreground

区分语言的设置

举例来说,如果要更改Javascript的语法高亮,就在上图中选择Javascript,然后再进行详细设置。具体设置项就不赘述了。

显示行号 + 自动换行

如果用Vim编程,行号是非常必要的辅助。WebStorm默认是不显示行号的,没关系,显示行号非常的容易。

只要在代码左侧的gutter区域点右键,就会出现下图的菜单:勾选上Show Line Numbers即可。

另外,勾选上图中的Use Soft Wraps就启用了WebStorm的自动换行的功能,即过长的代码行不会超出屏幕,不会出现横向的滚动条。

值得一提的是,标准的Vim,jk是移到上一行下一行,如果代码自动换行了,被分割成的两行虽然看起来是两行,但其实是一个逻辑行,这时候用jk是上移下移一个逻辑行。这种情况下,如果要从同一逻辑行的“第一行”移动到“第二行”,需要按gj,即先按g再按方向。虽然Vim提供了这个方法,但还是经常按错。

好消息是,启用了Use Soft Wraps的WebStorm不需要这样,直接按j就可以从同一逻辑行的“第一行”移动到“第二行”。

导入导出设置

File > Export Settings导出用户设置。如下图,你可以选择要导出哪些类型的设置,也可以选择导出到哪个目录下。

导出后的配置以jar包的形式存在,导入也同样简单,File > Import Settings,选择jar包导入成功后,重启WebStorm就大功告成了。

以下是我自定义的IDE配置,注意下载后需先解压缩成jar包。

WebStorm 自定义字体+颜色+语法高亮+导入导出用户设置的更多相关文章

  1. windows print 自定义字体颜色【python】

    windows print 自定义字体颜色 import ctypes STD_INPUT_HANDLE = -10 STD_OUTPUT_HANDLE= -11 STD_ERROR_HANDLE = ...

  2. oracle创建表空间、创建用户、授权角色和导入导出用户数据

    使用数据库管理员身份登录 -- log as sysdba sqlplus / as sysdba; 创建临时表空间 -- create temporary tablespace create tem ...

  3. MySQL问题记录——导入导出权限设置

    MySQL问题记录——导入导出权限设置 摘要:本文主要记录了在使用MySQL的过程中导入导出权限设置时遇到的问题以及解决方案. 相关日志 [Note] --secure-file-priv is se ...

  4. 用exp、dmp导入导出用户到同一个实例下时,类型type会有问题

    oralce的type都有唯一id,在同一个实例下,通过导入导出方法创建type时,会有唯一性问题 最好的解决方法使用impdb,expdb的方式导入导出 用oid=n解决. 实在不行,可用稍微麻烦的 ...

  5. webstorm 支持vue element-ui 语法高亮属性自动补全

    如果webstorm中 提示 Unknown html tag el-*** 说明没有加载 node_modules 下的 element-ui 解决办法就是: 在webstorm 打开的状态下 第一 ...

  6. drawable自定义字体颜色

    一个很基础简单的问题,但是以前没用过,都是代码控制效果的,最近新的项目发现设置了color属性没效果,后来查了会资料才发现得单独设置,记录一下,虽然是小问题 上面的xml控制背景的变化,一开始我设置在 ...

  7. Android SearchView 自定义SearchIcon和字体颜色大小

    自定义SearchView的搜索图标和字体属性相对复杂一些,记下来. 一.自定义SearchIcon 1.API版本低于21:版本小于21时,要修改SearchIcon比较复杂,需要先获取到Searc ...

  8. NOPI实现导入导出泛型List,支持自定义列

    概述 业务上需要自定义列的Excel的导入导出,在网上看了好多资料,很多都是有Bug而且都是支持Excel和DataTable的转换,所以自己总结了一下,应用.NET平台上的NPOI封装了支持自定义列 ...

  9. java实现文件批量导入导出实例(兼容xls,xlsx)

    1.介绍 java实现文件的导入导出数据库,目前在大部分系统中是比较常见的功能了,今天写个小demo来理解其原理,没接触过的同学也可以看看参考下. 目前我所接触过的导入导出技术主要有POI和iRepo ...

随机推荐

  1. Delphi 获取内存及CPU信息的函数

    Uses MemoryCpuUtils;//首先引用该单元 //声明下列变量用来存储读取的数值 Var iTotalPhysics, iTotalVirtual, iTotalPageFile, iC ...

  2. --@ui-router——$state服务原版详解

    $state service in module ui.router.state Description $state service is responsible for representing ...

  3. 数据契约(DataContract)的作用

    服务契约定义了远程访问对象和可供调用的方法,数据契约则是服务端和客户端之间要传送的自定义数据类型. 一旦声明一个类型为DataContract,那么该类型就可以被序列化在服务端和客户端之间传送,如下所 ...

  4. A tutorial on Principal Components Analysis | 主成分分析(PCA)教程

    A tutorial on Principal Components Analysis 原著:Lindsay I Smith, A tutorial on Principal Components A ...

  5. Tomcat的安装配置与JavaWeb入门教程

    本文开发环境: windos7 , Eclipse-mars , JDK1.7 , Tomcat7.0 1.关于Tomcat 先来看一段Tomcat的介绍: Tomcat是Apache 软件基金会(A ...

  6. 简学Python第二章__巧学数据结构文件操作

    #cnblogs_post_body h2 { background: linear-gradient(to bottom, #18c0ff 0%,#0c7eff 100%); color: #fff ...

  7. 学习window系统下的注册表

    一直不明白注册表是一个什么鬼,查了资料后大概明白了注册表到底有什么用,其实简单来说注册表就是一个存放系统.硬件.应用配置信息的数据ku.##### 一.注册表的来历在最早的视窗操作系统win3.x中, ...

  8. 内功心法 -- java.util.ArrayList<E> (6)

    写在前面的话:读书破万卷,编码如有神--------------------------------------------------------------------下文主要对java.util ...

  9. Android实现先横向横线展现在纵向拉开图片

    前段时间产品那边让我做一个动画,要求是先以横线的方式横向展开,在纵向展示图片,最后展示几秒动画在原路返回,随后我在网上查找资料,发现这方面的记录很少,最后自己写了一个 后期还会慢慢改进: 转载请说明出 ...

  10. Python 黑帽编程 4.2 Sniffer之数据本地存储和加载

    在上一节,我们完成了编写一个简易的Sniffer的第一步--数据捕获. 很多时候,我们需要将捕获的数据先保存到磁盘上,之后再使用工具或者自己编写代码来进行详细分析. 本节我们在上一节的基础上来讲解保存 ...