. 打开Preferences菜单,并选择 Browse Packages…
. 系统会打开Sublime Text 的Packages文件夹,回到上一级菜单,然后打开Installed Packages文件夹
. 下载并将下载的Package Control.sublime-package拷贝到Installed Packages文件夹(注意此处是Installed Packages,不是Packages文件夹)
. 重启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":".*"
}
} ]

SideBarEnhancements 侧边栏增强

{
"color_scheme": "Packages/User/SublimeLinter/Monokai (SL).tmTheme",
"draw_minimap_border": true, // 右侧缩略图边框
"font_face": "Monaco",//字体
"font_size": , // 字体大小
"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": , //空格数
"fade_fold_buttons": false, //显示代码块的倒三角
"bold_folder_labels": true, //侧边栏文件夹加粗
"auto_find_in_selection": true //开启选中范围内搜索
}

sublime settings user

{
// exposed jsbeautifier options
"indent_with_tabs": false,
// 保留换行符
"preserve_newlines": true,
// 最大连续保留2二个换行符,也就是有一个空行
"max_preserve_newlines": ,
// 在条件语句前有空格
"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":,
"wrap-line-length":,
"end-with-newline":true,
// 支持JSX
"e4x": true,
//最初的缩进级别
"indent_level": ,
// 缩进二个字符
"indent_size": ,
// 缩进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"]
}

jsformat settings

在"allowed_file_extensions": ["htm", "html", "xhtml", "shtml", "xml", "svg","vue"] 加上vue就好了

HTML/CSS/JS Prettify 中配置.vue的美化

JSFMT 配置:
在\AppData\Roaming\Sublime Text \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":
},
"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

sublime text3 常用配置的更多相关文章

  1. SubLime Text3 常用插件总结

    近来开始恶补前端知识,在一定的技能基础上,逐渐开始进阶的学习和使用.因此在这里罗列下,SubLime Text3 常用插件: 1.Emmet 提高HTML & CSS3编写速度. 2.Them ...

  2. 前端神器Sublime Text3 常用插件&常用快捷键

    Sublime Text3常用插件 使用Package Control组件安装 也可以安装package control组件,然后直接在线安装: 按Ctrl+`调出console(注:安装有QQ输入法 ...

  3. 4.8 Sublime Text3 中配置 Python环境 --之下Sublime配置Python环境

    返回总目录 目录: 1.没有配置之前 2.安装Package Control插件 3.安装其他库: 4.配置其他操作: (一)没有配置之前: 我们试着运行以下,会效果怎么样? 1.首先选择Python ...

  4. 4.7 Sublime Text3 中配置 Python环境 --之上安装Sublime 3

    返回总目录 目录: 1.展示效果: 2.缺优分析: 3.下载Sublime Text3 (一)展示效果: 1.能够交互式编写Python代码: 2.可以编写文件式Python代码: 3.能够自动补齐代 ...

  5. Sublime Text3—常用插件Emmet

    摘要 安装请看上一篇Sublime Text-安装,和sublime自带快捷键一起用,写html简直快的飞起. 下面整理的是常用的,完整的可看emmet官方文档. 一.生成标签 1.快速生成文档结构 ...

  6. Sublime text3常用的插件功能和常用的快捷键

    Sublime text3常用的插件功能和用法 Package control 插件管理 (使用ctrl+` 将代码复制后粘贴到代码粘贴处,按Enter没有出现错误的话就安装成功了)(ctrl+shi ...

  7. Sublime Text3 常用快捷键必看

    Sublime Text3 常用快捷键必看  https://blog.csdn.net/md1688/article/details/53043525

  8. ubuntu sublime text3 python 配置 sublime text3 python 配置

    ubuntu sublime text3 python 配置     1.安装sublime text 3 安装过程非常简单,在terminal中输入: sudo add-apt-repository ...

  9. Sublime text3 常用插件 安装

    1 安装插件前的准备工作 首先确保你的Sublime Text3编辑器为官方版(非破解版),建议下载官网的便携版本(好处多多). 然后安装插件管理工具(Package Control) 1.1 打开S ...

随机推荐

  1. 大数据-Hive 常用命令

    Hive 启动 ~$ hive 退出 hive>quit; --退出hive or hive> exit; --exit会影响之前的使用,所以需要下一句kill掉hadoop的进程 > ...

  2. Memcached安装&启动

    安装 *Linux系统安装memcached,首先要先安装libevent库,安装请指定 --with--libevent=PATH(若安装过程中出现configure: error : no acc ...

  3. spring boot: 支持jsp,支持freemarker

    spring boot: 支持jsp,支持freemarker 支持jsp: 加入依赖 <!--jsp--> <dependency> <groupId>org.a ...

  4. phalcon的save方法保存失败?

    phalcon的save方法保存失败? 因为表中设置了一个字段:disabled, 默认值是1, 在创建数据的时候,disabled没有传值过去,导致save方法一直是false, 当返回false时 ...

  5. 雷林鹏分享:XML 编辑器

    XML 编辑器 如果您希望极认真地学习和使用 XML,那么您一定会从一款专业的 XML 编辑器的使用上受益. XML 是基于文本的 XML 是基于文本的标记语言. 关于 XML 的一件很重要的事情是, ...

  6. 如何启动iis(Internet 信息服务(IIS)管理器)

    Internet 信息服务(IIS)管理器 启动 IIS 管理器1.从“开始”菜单,指向“管理工具”,然后单击“Internet 信息服务 (IIS) 管理器”. 从“运行”对话框启动 IIS 管理器 ...

  7. G711编解码

    http://blog.csdn.net/rightorwrong/article/details/4209467 搞语音对讲几天了,播放时声音干扰太大了.拖得时间久有两个原因: 1.每次采样的位数这 ...

  8. Node.js 知识(教程)

    JavaScript on the Server JavaScript was originally built for web browsers, but with Node.js we can u ...

  9. android-------- socket 实现客户端与服务器端通信

    前面介绍了Socket的简介和原理,今天简单的来实现一下客服端与服务器通信的功能 客服端 建立连接 try { socket = new Socket("192.168.1.100" ...

  10. DRF之权限认证,过滤分页,异常处理

    1. 认证Authentication 在配置文件中配置全局默认的认证方案 REST_FRAMEWORK = { 'DEFAULT_AUTHENTICATION_CLASSES': ( 'rest_f ...