在这里只介绍自己经常使用的编辑器sublime

第一:安装node插件[出处:http://www.bubuko.com/infodetail-798008.html]

1、下载Nodejs插件,下载地址为:
https://github.com/tanepiper/SublimeText-Nodejs

下载zip压缩包后解压,文件名改为Nodejs

2、打开Sublime Text3,点击菜单“Perferences” =>“Browse Packages”打开“Packages”文件夹,并将第1部的Nodejs文件夹剪切进来

3、打开文件“Nodejs.sublime-build”,将代码 "encoding": "cp1252" 改为 "encoding": "utf8" ,将代码 "cmd": ["taskkill /F /IM node.exe & node", "$file"] 改为 "cmd": ["node", "$file"] ,保存文件

4、打开文件“Nodejs.sublime-settings”,将代码 "node_command": false改为 "node_command": "D:\\Program Files\\nodejs\\node.exe" ,将代码 "npm_command": false 改为 "npm_command": "D:\\Program Files\\nodejs\\npm.cmd" ,保存文件

5、编写一个测试文件test.js,按“ctrl+B"运行代码,运行结果如下图所示:

至此,环境配置成功!

(注:本人的系统为Win7,Nodejs安装路径为D:\Program Files\nodejs)

第二:安装一款自己喜欢的主题[出处:http://www.tuicool.com/articles/FreQNzi]

2016年 package control 中最好的Sublime Text 3 主题。

Sublime Text是一个强大的令人难以置信的编辑器。 它不仅具有大量的功能,而且还有很多主题,让他看起来很漂亮。 我们以前整理过 2014年的最好的主题 ; 让我们看看最新的Sublime Text 3主题。

安装主题

要安装主题,请先先安装 Package Control ,接下来的步骤如下:

  1. ctrl + shift + p  或  cmd + shift + p
  2. 查找  Package Control: Install Package
  3. 搜索主题并按回车键(enter)
  4. 查看  Preferences -> Settings – User 中的主题,如果要修改主题,只要编辑json中 theme选项就可以了
{
"theme": "Lanzhou.sublime-theme"
}

注:下面主题截图中使用的是 Operator Mono 字体。

Boxy

  • 拥有四个高品质的主题和多个配色方案。
  • 各种各样的选项来调整编辑器的每个视觉细节。

在 Package Control 中查看 Boxy

{
// Boxy Yesterday
"color_scheme": "Packages/Boxy Theme/schemes/Boxy Yesterday.tmTheme",
"theme": "Boxy Yesterday.sublime-theme",
}

{
// Boxy Tomorrow
"color_scheme": "Packages/Boxy Theme/schemes/Boxy Tomorrow.tmTheme",
"theme": "Boxy Tomorrow.sublime-theme",
}

{
// Boxy Ocean
"color_scheme": "Packages/Boxy Theme/schemes/Boxy Ocean.tmTheme",
"theme": "Boxy Ocean.sublime-theme",
}

{
// Boxy Monokai
"color_scheme": "Packages/Boxy Theme/schemes/Boxy Monokai.tmTheme",
"theme": "Boxy Monokai.sublime-theme",
}

Material Theme

在 Package Control 中查看 Material Theme

{
// Default theme
"theme": "Material-Theme.sublime-theme",
"color_scheme": "Packages/Material Theme/schemes/Material-Theme.tmTheme"
}

{
// Darker theme
"theme": "Material-Theme-Darker.sublime-theme",
"color_scheme": "Packages/Material Theme/schemes/Material-Theme-Darker.tmTheme"
}

{
// Lighter theme
"theme": "Material-Theme-Lighter.sublime-theme",
"color_scheme": "Packages/Material Theme/schemes/Material-Theme-Lighter.tmTheme"
}

Agila

  • 文件树中间距很大的文件夹,以便于阅读。
  • Agila Oceanic和流行的Spacegray主题有种类似的感觉。

在 Package Control中查看Agila

{
// Default theme
"theme": "Agila.sublime-theme",
"color_scheme": "Packages/Agila Theme/Agila Oceanic Next.tmTheme"
}

{
// Classic theme
"theme": "Agila Classic.sublime-theme",
"color_scheme": "Packages/Agila Theme/Agila Classic Oceanic Next.tmTheme"
}

{
// Light theme
"theme": "Agila Light.sublime-theme",
"color_scheme": "Packages/Agila Theme/Agila Light Solarized.tmTheme"
}

Lanzhou

  • 边栏和编辑器之间的良好对比,如果你使用暗颜色方案,和 Base16 Ocean Dark 类似。

在Package Control中查看 Lanszhou

{
"theme": "Lanzhou.sublime-theme",
"color_scheme": "Packages/Theme - Lanzhou/base16-ocean.dark.tmTheme"
}

Sunrise

在Package Control中查看 Sunrise

{
"theme": "Sunrise.sublime-theme"
}

Kronuz

在Package Control中查看 Kronuz

{
"theme": "Theme - Kronuz.sublime-theme",
"color_scheme": "Packages/Theme - Kronuz/Kronuz.tmTheme"
}

Autumn

  • 在文件树上有一种很酷的透视效果。
  • 看起来很像Monokai。

在Package Control中查看 Autumn

{
"theme": "Autumn.sublime-theme",
"color_scheme": "Packages/Theme - Autumn/Autumn.tmTheme"
}

选择主题的几个小建议

  • 每个人的眼睛看到的颜色是不同,找一个背景和文本之间有良好的对比主题。
  • 当你的眼睛累了,或者深夜的时候,你可以考虑使用 Flux 类似的软件。
  • 试试 Colorsublime ,它允许您在Sublime Text中立即更改当前的颜色方案。

结论

到目前为止,我最喜欢的主题和配色方案是Boxy Monokai,第二个是Agila。还有,我发现这些主题的配色方案针对不同的文件(ES6, ReactJS/JSX, 或者 HTML)有不同的语法高亮。

如果你喜欢其他的主题或配色方案,欢迎留言告知。

翻译自: https://scotch.io/bar-talk/best-sublime-text-3-themes-of-2015-and-2016

第三:安装注释头

插件名称是DocBlockr

第四:安装vue高亮插件[出处:http://www.cnblogs.com/binlucky/p/6471351.html]

  1. 下载的文件
    link: https://pan.baidu.com/s/1nv7C4B3 密码: w5zs
  2. sublime菜单栏 -> 首选项 -> 浏览插件,打开Packages文件夹
  3. 把步骤1的文件解压到packages目录
  4. sublime 中 Ctrl + Shift + P 输入 vue  回车
  5. 重启sublime 打开.vue文件 看到高亮语法了

    第五 代码格式化插件

插件 HTML beautiful  快捷键 ctr+shift+h  其中js,css,html都可以格式化

编辑器——sublime的更多相关文章

  1. 编辑器sublime text3和插件package control、Sidebar Enhancements插件安装

    (1)编辑器sublime text3的安装:选择自己需要的版本下载安装:http://www.sublimetext.com/3 (2)package control插件安装:https://pac ...

  2. 比NotePad++更好的文本代码(C#)编辑器Sublime Text

    原文:比NotePad++更好的文本代码(C#)编辑器Sublime Text 前言 前两天在博客园看到@晴天猪的博客发表的关于他使用的代码编辑器,自己索性试了一下,果断好用,自己也来记录一下.以便以 ...

  3. 编辑器sublime、终端运行python

    sublime编辑器 Sublime Text 是一个代码编辑器(Sublime Text 2是收费软件,但可以无限期试用) Sublime Text是由程序员Jon Skinner于2008年1月份 ...

  4. Python开发环境从零搭建-02-代码编辑器Sublime

    想要从零开始搭建一个Python的开发环境说容易也容易 说难也能难倒一片开发人员,在接下来的一系列视频中,会详细的讲解如何一步步搭建python的开发环境 本文章是搭建环境的第2篇 讲解的内容是:安装 ...

  5. 代码编辑器Sublime Text 3 免费使用方法与简体中文汉化包下载

    Sublime Text这款代码编辑器是Jeff 一直都在使用的,前段时间转用到版本3,因为感觉Sublime Text 3 启动速度更加快,运行更加流畅——虽然3 还是在Beta 阶段.下面就直接分 ...

  6. linux默认编辑器 sublime

    开发人员把Vi improved简称Vim Vim编辑器再内存缓冲区中处理数据. 如果再启动Vim时未指定文件名,或者这个文件不存在,Vim会新开一段缓冲区域来编辑. 如果你再命令行下指定了一个已有文 ...

  7. [编辑器]sublime使用入门

    0.索引 1.新建工程 2.控制台 3.快捷键汇总 4.安装插件 1.新建工程: 没有找到直接新建工程的方法,目前看来只能先file -> open folder然后Save Project a ...

  8. 关于个人编辑器sublime text3使用指南

    用过了好多编辑器,前些年用的zend studio,phpstorm近两年转为nodepad++(因为写的语言种类比较多了,shell,python,php,前端等),相对于nodepad++,  s ...

  9. Linux/Ubuntu 16.04 安装编辑器 Sublime Text 3

    在ubuntu 16.04 系统上使用Sublime Text 3 编辑文本还是不错的, 先到官网下载安装包,链接:http://www.sublimetext.com/3 ,下载对应的版本,64位或 ...

随机推荐

  1. tinycore remaster方法

    11.1. PrerequisitesYou need a Linux distribution with the required programs available:cpio, tar, gzi ...

  2. zoj 3370(二分+二分图染色)

    题目链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=3912 思路:二分覆盖直径,然后判断是否有冲突(即距离小于等于直径的不 ...

  3. 权限模块_整体方案说明_设计实体&映射实体_实现初始化权限数据的功能

    权限模块_整体方案说明 要点说明 权限就是控制功能的使用(功能对应着URL). 对功能的控制就是对URL的访问控制. 在我们的程序中,一个功能对应一个或两个URL: 1,例如列表或删除功能,只对应一个 ...

  4. Hadoop1.x目录结构及Eclipse导入Hadoop源码项目

    这是解压hadoop后,hadoop-1.2.1目录 各目录结构及说明: Eclipse导入Hadoop源码项目: 注意:如果没有ant的包可以去网上下,不是hadoop里面的. 然后如果通过以上还报 ...

  5. FAIL : SSHException: Incompatible ssh peer (no acceptable kex algorithm)问题解决及更新paromiko失败问题解决

    转自:http://blog.csdn.net/qy924565830/article/details/52164256 http://blog.csdn.net/coder_xia/article/ ...

  6. 使用vue来做局部刷新

    我们都知道,vue的组件化是他最强大的核心所在,路由也是特别可爱的一部分,但是路由适合一些大型的组件,看url路径的时候会出现变化,但是有时候我们想要一些小的局部小刷新,这个时候就需要用到它的动态组件 ...

  7. PMP 质量管理新7张图

    亲和图.关联图.系统图.矩阵图.网络图.pdpc.矩阵数据分析法

  8. 厚积薄发系列之JDBC详解

    创建一个以JDBC链接数据库的程序,包含七个步骤 1.加载JDBC驱动 加载要连接的数据库的驱动到JVM 如何加载?forName(数据库驱动) MySQL:Class.forName("c ...

  9. jQuery返回顶部实用插件YesTop

    只需一句jQuery代码实现返回顶部效果体验:http://hovertree.com/texiao/yestop/ 使用方法:只需引用jQuery库和YesTop插件(jquery.yestop.j ...

  10. 160520、MyBatis的几种批量操作

    MyBatis中批量插入 方法一: <insert id="insertbatch" parameterType="Java.util.List"> ...