1. 打开Preferences菜单,并选择 Browse Packages… 2. 系统会打开Sublime Text 的Packages文件夹,回到上一级菜单,然后打开Installed Packages文件夹 3. 下载并将下载的Package Control.sublime-package拷贝到Installed Packages文件夹(注意此处是Installed Packages,不是Packages文件夹) 4. 重启Sublime Text
perferences>package control,(ctrl+shift+p)输入 install 选中Install Package并回车,输入或选择你需要的插件回车就安装了(注意左下角的小文字变化,会提示安装成功)
常用插件配置:
[// chrome{ "keys": ["f2"], "command": "side_bar_files_open_with","args": {"paths": [],"application": "S:/Program Files (x86)/Google/Chrome/Application/chrome.exe","extensions":".*"}},// firefox{ "keys": ["f3"], "command": "side_bar_files_open_with","args": {"paths": [],"application": "S:/Program Files (x86)/Mozilla Firefox/firefox.exe","extensions":".*"}},// ie{ "keys": ["f4"], "command": "side_bar_files_open_with","args": {"paths": [],"application": "S:/Program Files/Internet Explorer/iexplore.exe","extensions":".*"}}]
{"color_scheme": "Packages/User/SublimeLinter/Monokai (SL).tmTheme","draw_minimap_border": true, // 右侧缩略图边框"font_face": "Monaco",//字体"font_size": 10, // 字体大小"highlight_line": true, // 当前行标亮"save_on_focus_lost": true, // 当前行标亮"word_separators": "./\\()\"':,.;<>~!@#$%^&*|+=[]{}`~?", // 双击选中中划线"word_wrap": true, //自动换行"trim_trailing_white_space_on_save": true, //自动移除行尾多余空格"ensure_newline_at_eof_on_save": true, //文件末尾自动保留一个空行"disable_tab_abbreviations": true, //禁用 Emmet 的 tab 键功能(请使用 ctrl+e)"translate_tabs_to_spaces": true, //把代码 tab 对齐转换为空格对齐"tab_size": 4, //空格数"fade_fold_buttons": false, //显示代码块的倒三角"bold_folder_labels": true, //侧边栏文件夹加粗"auto_find_in_selection": true //开启选中范围内搜索}
{ // exposed jsbeautifier options "indent_with_tabs": false, // 保留换行符 "preserve_newlines": true, // 最大连续保留2二个换行符,也就是有一个空行 "max_preserve_newlines": 2, // 在条件语句前有空格 "space_before_conditional":false, //括弧添加空格 "space_in_paren": false, // 在函数的括弧后面添加空格 "space-after-anon-function":true, "jslint_happy": false, // [collapse-preserve-inline|collapse|expand|end-expand|none] ["collapse"] // 代码的样式 "brace_style": "collapse", "keep_array_indentation": false, "keep_function_indentation": false, "eval_code": false, "unescape_strings": false, "break_chained_methods": false, "wrap_attributes_indent_size":0, "wrap-line-length":0, "end-with-newline":true, // 支持JSX "e4x": true, //最初的缩进级别 "indent_level": 0, // 缩进二个字符 "indent_size": 2, // 缩进2个字符,字符是一个空格 "indent_char":" ", //"eol":"\n", // 保存时自动格式化 "format_on_save": true, //格式化选中的文本 "format_selection": true, // 是否启动.jsbeautifyrc文件 "jsbeautifyrc_files": false, "ignore_sublime_settings": true, "format_on_save_extensions": ["js", "json"]}
在"allowed_file_extensions": ["htm", "html", "xhtml", "shtml", "xml", "svg","vue"] 加上vue就好了
JSFMT 配置:在\AppData\Roaming\Sublime Text 3\Packages\jsfmt目录安装
>npm install esformatter>npm install esformatter-jsx
在user setting配置
{ "autoformat": true, "extensions": [ "js", "jsx", "sublime-settings" ], "options": { "jsx": { "alignWithFirstAttribute": true, "attrsOnSameLineAsTag": false, "firstAttributeOnSameLine": false, "formatJSX": true, "maxAttrsOnTag": 1 }, "plugins": [ "esformatter-jsx", // "esformatter-quotes", // "esformatter-semicolons", // "esformatter-braces", // "esformatter-dot-notation" ] }}
设置快捷键:
{ "keys": ["ctrl+q"], "command": "format_javascript" },
安装报错时,ctrl+`查看console,把缺失的包按提示安装好
常用插件:
ES6, React.js, jsx代码高亮: babel
配置:打开.js, .jsx 后缀的文件;打开菜单view, Syntax -> Open all with current extension as... -> Babel -> JavaScript (Babel),选择babel为默认 javascript 打开syntax
Angular:TypeScript; React: React ES6 Snippets,