. 打开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. Opencv各种编码器下视频文件大小对比

    转载自http://blog.csdn.net/dcrmg/article/details/52215930 做视频样本切割,切片用ffv1编码,比原数据大了几十倍,看到了这篇文章,防止找不到记录一下 ...

  2. Python全栈开发-执行字符串形式的语句和字符串形式的表达式方法(即exec和eval方法)

    Python有时需要动态的创造Python代码,然后将其作为语句执行  或  作为表达式计算. exec用于执行存储在字符串中的Python代码.   1. 语句与表达式的区别:表达式是 某事,语句是 ...

  3. 全栈性能测试修炼宝典--Jmeter实战(三)

    JMeter体系结构 1.JMeter体系结构 (1)名词解释 元件:JMeter工具菜单中的一个子菜单,比如HTTP请求.事务控制器.响应断言就是一个元件. 组件:一组元件的集合,比如逻辑控制器中有 ...

  4. Android 如何更改一个 imageview的颜色

    xml中可以使用tint属性 tips:这里的图片必须是png格式的文件才行,不然你得到的就是一个被纯色覆盖的图 java中 使用 imageView.setColorFilter(Color.WHI ...

  5. android -------- 解决NDK开发中的 Method 'NewStringUTF' could not be resolved

    创建NDK项目时, .cpp文件中出现错误, Method 'NewStringUTF' could not be resolved 如图: 网上看了很多解决方式 项目右键->属性->c/ ...

  6. jquery插件中找到好玩插件 http://www.jq22.com/

    超实用的angular.js无刷新分页完整案例 http://www.jq22.com/jquery-info14714 js联动选择插件mobileSelect.js http://www.jq22 ...

  7. lanmp环境一键安装

    yum install -y wgetwget http://dl.wdlinux.cn/files/lanmp_v3.2.tar.gztar zxvf lanmp_v3.2.tar.gzsh lan ...

  8. 有标号的DAG计数

    看了某神仙博客学了一手,基本的思路就是容斥入度为0的点. n^2做法. F(n)=sigema i (-1)^(i-1)✖ C(n,i)✖ F(i)✖ 2^(j*(i-j)) nlogn做法 对上述式 ...

  9. Javascript的常见数据类型以及相应操作

    JavaScript概述 1 ECMAScript和JavaScript的关系 1996年11月,JavaScript的创造者--Netscape公司,决定将JavaScript提交给国际标准化组织E ...

  10. Codeforces Round #525 (Div. 2)-A/B/C/E

    http://codeforces.com/contest/1088/problem/A 暴力一波就好了. //题解有O(1)做法是 (n-n%2,2) #include<iostream> ...