Skip to content
This repository

Intellij IDEA / PHPStorm / WebStorm Front End Engineer Guide (中文)

branch: master
README.md

IntelliJ-IDEA-F2E

IntelliJ IDEA, PHPStorm, WebStorm 前端开发指南.

常规文本编辑器之于IDE(集成开发环境), 好比 Markdown 之于 HTML
Markdown 杀鸡嗷嗷叫, 但做网站必须得 HTML
这件事情告诉我们, 高帅富配白富美, 屌丝配右手
最适合你的编辑器,就是世界上最好的编辑器
切莫活在别人的世界里

编辑器选择

WebStorm 针对前端开发集成了一些比较常用的例如node.js LESS之类,性能好速度快
PHPStorm 针对PHP也做了一些优化,并且包含了 WebStorm
IntelliJ IDEA 则通过插件形式集成上面两者的功能,并且是主力 JAVA IDE, 功能强,速度慢,吃内存多
我目前是同时装了 WebStorm 和 IntelliJ IDEA,反正配置通用,按需取用。

因特里基友QQ群(人多,严禁跑题,违者T)

我在使用XX遇到了问题。
我已经尝试过XXX方法。
现在问题的具体表现、信息为XXXXXX。
这样的格式更有利于解决问题。

附赠:提问的智慧

避免无意义的讨论,例如打招呼,例如美化比较主观,没有固定答案的问题都不能讨论
如果对大部分人都无价值的话题,建议私聊

群号:149725975 (CSS/HTML/JavaScript/PHP IntelliJ IDE/PHPStorm/WebStorm)
群号:244908708 (偏后端)

入群问题答案请 包含小写有空格的关键字 intellij idea

注册

所有大版本序列号都是通用的
等你脚的 IntelliJ IDEA 帮你赚钱了,记得购买正版授权,或者传递真爱给身边的同学

促销

开源中国正版全系列7折

编辑器界面

Settings > Appearance > Look and Feel,
黑色的到 IntelliJ IDEA 12 才有,叫 Darcula

配色

妹纸到手,第一步就是扒光
IntelliJ IDEA 的配色是 icls 或 jar 文件 可能还有些xml的丢到目录里会自动转换为 icls 文件

icls:

  • for Mac OS, ~/Library/Preferences/IntelliJIdea13/colors/
  • for Linux, ~/.IntelliJIdea13/config/colors/
  • for Windows, C:\Documents and Settings\user.IntelliJIdea13\config\colors

jar: File > Import Settings

比较常用的有 intellij-colors-solarized , Twilight , Obsidian, Tomorrow

比较全面的有 Idea Color Schemes PHPStorm Themes

Sublime Text2 转过来的同学还有 Obsidian Color Scheme

Sublime Text2 的配色转成 idea (感谢 ash)

编辑器字体

Settings > Editor > Colors & Fonts > Font
字号我这里 17px 英文相对清晰,你可以根据预览来微调
IDEA12 开始自带了 Source Code Pro, Adobe 家的开源等宽字体,也很舒服滴
IntelliJ IDEA 中文乱码,字体优化解决之道 按照教程设置英文和中文2个字体,就可以分别爽了

性能优化

  • 如果有杀毒软件,请排除掉项目路径
  • 使用最新版
  • 关闭不认识的插件
  • Project 下的文件不要太多,否则会有大量的 I/O
  • Excluded 掉无需索引的目录
  • 关掉版本控制(svn git 啥的)
  • 升级硬件, SSD 神马的

FAQ

  • Windows 7 sometimes breaks FTP connections on Java 7 if firewall is enabled.Command netsh advfirewall set global StatefulFTP disable usually fixes the problem.
  • 官方《IDEA 30天速成》
  • 常用快捷键? 'Help > Default Keymap reference'
  • 如何自动换行? 答:全局 Settings > Editor > use soft wraps in editor ; 当前文档 在行号的位置右键选择 use soft wraps
  • 有木有 ST2 那种同时选中多个区域? 答:木有,我们一般用Refactor 重构(Shift + F6),列编辑(Alt + 拖动),批量替换(Ctrl + r) 来实现.
  • 右边那条线是啥? Settings>Appearance>Show right margin ; 这玩意儿格式化的时候控制换行区域,不用的话可以禁用
  • 关闭任意位置编辑(也称虚拟空格)? Settings>Editor>Allow placement of caret after end of line
  • 界面中文乱码?Setting>Appearance>Override default fonts by ,下拉框中选“微软雅黑”,可能找不到微软雅黑,因为中文字体也乱码了,所以先选一个乱码名字的字体就可以找到了。
  • 显示多列/行文件? tag 上右键选择 Split vertically / Split horizontally
  • 全屏模式? 'View>Enter full screen'
  • 注释在行首而不是紧接着代码? Code Style > Java > Comment Code > Line comment at first column
  • Project侧边里不显示文件夹? 因为没有 Module

教程

基础设置

技巧

Bug

  • SVN 1.8 的支持要到13版本才行 IDEA-94942
  • 如果通过FTP方式同步会导致中文文件名乱码,推荐用SFTP
  • 英文字体会导致中文显示成口口口,IntelliJ IDEA 中文乱码,字体优化解决之道
  • win8 拼音输入法吞字,请使用QQ拼音4.5提取密码:a4k3,要么用QQ拼音4.6的设置里高级关掉英文词语联想,或者安装第三方JDK如Oracle JRockit
  • 拖动滚动条浏览代码,松开鼠标,会自动滚回光标的位置,在哪里设置?有道词典的屏幕取词和划词翻译的勾选去掉(感谢阿安)
  • idea12 server log中文乱码的问题,解决办法是修改idea/bin目录下的idea.exe.vmoptions文件,增加配置-Dfile.encoding=UTF-8 (感谢匆匆过客);如果这样还不能解决,请参考 idea12 server log中文乱码解决方法
  • IDEA下tomcat启动报错解决

此文档由 IntelliJ IDEA Markdown 插件编辑 && Github 插件提交,欢迎补充())

Something went wrong with that request. Please try again.