常用插件
AutoFileName
在输入文件的时候提示文件路径,以免手动输入错误Babel
支持ES6ConverToUTF8
支持GBK等编码的正常展示Emmet
前端神器,必装Jade
支持jadeModific
提示与上次commit之间的改动,并高亮提示Sass
支持sass
PS: 使用sass作为文件后缀的时候,每次打开都会发现syntax为ruby html,此时选择View -> Syntax -> Open all with current extension as… -> Sass(必须保证sass文件为Active Tab),之后再次就会发现syntax显示为Sass了Vue Syntax Highlight
支持VueESLint
js代码检查
需要安装
ST: sublime lint, SublimeLinter, SublimeLinter-contrib-eslint
NPM: eslint, babel-eslint(可能需要babel, babel-cli, babel-core, babel-preset-es2015等, 没单独测试过)
点击Preferences -> Package Settings -> SublimeLinter -> Setting-User打开配置文件(首先将Setting-Default中的配置信息拷贝过来)
将debug改为true,并添加以下内容"linters": { "eslint": { "@disable": false, "args": [], "excludes": [] } }
windows系统中还需在paths.windows中添加eslint.cmd的全局路径
osx中则需要保证npm全局目录添加到全局变量
之后在工程下添加.eslintrc就可以进行eslint检查了// 这是我的eslint配置 { "parser": "babel-eslint", "rules": { "indent": [ 2, "tab" ], "quotes": [ 2, "single" ], "semi": [ 2, "always" ], "no-console": 0 }, "env": { "es6": true, "node": true, "browser": true }, "extends": "eslint:recommended" }
tern_for_sublime
js代码提示神器,支持ES6的module
安装完成后进入到sublime text3 -> package -> tern_for_sublime执行npm i
点击Preferences -> Package Settings -> Tern -> Setting-User打开配置文件(首先将Setting-Default中的配置信息拷贝过来)
将tern_argument_hints和tern_argument_completion这两个key的值修改为true
点击Preferences -> Setting-User添加以下配置"auto_complete_triggers": [ { "characters": "<", "selector": "text.html" }, { "characters": ".", "selector": "source.js" } ]
之后在工程目录下添加.tern-project配置文件就可以进行代码提示了
{ // 支持BOM和ES6 "libs": ["browser", "es6"], "loadEagerly": [ "将js目录引入" ], "plugins": { // 支持ES6 Module "es_modules": {} } }