webstorm
webstorm 的配置分为项目配置和全局配置,在打开一个项目的时候,会在项目根目录生成.idea的隐藏文件夹,这个文件夹里保存的就是项目配置,而全局配置保存在文档目录,全局配置都可以导出。
插件
- AceJump
- altn8
- eslint-plugin
- gitignore
- IdeaVim
- Key_promoter
- TabSwitch
主题
配色方案
配置
打开多个项目
WebStorm默认情况下一次只能打开一个项目,这点很不爽,其实是可以设置的。(注:如果你一开始就建了项目再来配置,记得要把左边显示的根路径移除,不然可能点击Add Content Root配置后也不一定能生效)
方法:File -> Settings -> Directories -> Add Content Root 中添加你当前的工程目录。
配置webserver选项(端口)
方便其他ip设备访问(如手机等测试效果)
方法:File -> Settings -> Build,Execution,Development -> Debugger ->port
设置文件的默认编码
方法:File -> Settings -> Editor -> File Encodings -> IDE Encoding,Project Encoding.
(注:配置前和配置后都可以打开页面,在页面的右下角显示有编码)
文件模板配置
文件模板即新建文件的时候可以初始化一个预先定义好的文件内容,比如常见的HTML、CSS、JS文件等。这些文件模板在IDE Settings》File and Code Templates 里添加和修改,如图:
项目文件夹标记配置
在开发的时候,常常资源等信息并不是指向根目录,在书写资源路径的时候提示是不正确的,这时候就需要配置文件夹功能了。打开Project Settings > Directories 里打开,绿色的为测试目录,红色的为排除目录,蓝色的为资源根目录。
项目代码检查
打开Project Settings > JavaScript > Code Quality Tolls > JSHint 启用,默认配置即可。然后在末尾添加全局变量,以通过代码检查
CSS预处理语言的预编译、JS 实时压缩
有了 webstorm,基本不需要 grunt、gulp 等前端开发辅助工具了,webstorm 内置的文件监听,可以完成常用的功能,如 CSS 预处理语言的预编译、JS 的实时压缩等。
打开Project Settings > FIle Watchers,然后点击下边的加号开始新建即可
项目脚本库
项目在开发的时候,可以配置项目已经用到的脚本库,可以方便的在编程的时候提示,加快开发速度和代码质量检测。内置的有HTML5、NodeJS 等,如果不存在的也可以手动添加。在 Project Settings > JavaScript > Libraries 里打开
快捷键
# 格式化
command+alt+l
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。