Skip to content

Instantly share code, notes, and snippets.

@jakefentress
Forked from davatron5000/Sublime Text Setup.md
Last active September 9, 2016 14:24
Show Gist options
  • Save jakefentress/adc1ef5b6a785177e3df to your computer and use it in GitHub Desktop.
Save jakefentress/adc1ef5b6a785177e3df to your computer and use it in GitHub Desktop.
Preferences, color schemes, and packages for Sublime Text.

Make it useful

Install Package Control. For Sublime Text 3, paste the following in the Sublime Text console (get there via ctrl+ `):

import urllib.request,os,hashlib; h = '7183a2d3e96f11eeadd761d777e62404' + 'e330c659d4bb41d3bdf022e94cab3cd0'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

From here on out, use Package Control to install everything. +Shift+P, then type Install to get a list of installable packages you can search through. After installing plugins, they should be running.

You should install packages for any languages you use (such as Sass — which is called Scss in Package Control).

Make it look good

Add helpful tools

  • AlignTab makes it easy to align blocks of code. If you work in Sass or CSS, do yourself a favor and add the following code to Perferences -> Package Settings -> AlignTab -> Context Menu:

      [
         {"caption" : "{"},
          {
            "id": "aligntab",
            "caption": "Align By",
            "children": [
                {
                "caption" : "First {",
                "command" : "align_tab",
                "args"    : {"user_input" : "{"}
                }
            ]
        }
      ]
    
  • SideBarEnhancements for an actually useful sidebar. I like to edit the right-click "Open With" menu (right click, go to open with and select "Edit Applications":

      [
      	{"id": "side-bar-files-open-with",
      		"children":
      		[
    
      			//application 1
      			{
      				"caption": "Photoshop",
      				"id": "side-bar-files-open-with-photoshop",
    
      				"command": "side_bar_files_open_with",
      				"args": {
      									"paths": [],
      									"application": "Adobe Photoshop CC 2015.app", // OSX
      									"extensions":"psd|png|jpg|jpeg",  //any file with these extensions
      									"args":[]
      								},
      				"open_automatically" : false // will close the view/tab and launch the application
      			},
    
      			//separator
      			{"caption":"-"},
    
      			//application Terminal
      			{
      				"caption": "Terminal",
      				"id": "side-bar-files-open-with-terminal",
    
      				"command": "side_bar_files_open_with",
      				"args": {
      									"paths": [],
      									"application": "Terminal.app",
      									"extensions":"", //open all even folders
      									"args":[]
      								},
      				"open_automatically" : false // will close the view/tab and launch the application
      			},
      			//application chrome
      			{
      				"caption": "Chrome",
      				"id": "side-bar-files-open-with-chrome",
    
      				"command": "side_bar_files_open_with",
      				"args": {
      									"paths": [],
      									"application": "Google Chrome.app",
      									"extensions":".*", //any file with extension
      									"args":[]
      						},
      				"open_automatically" : false // will close the view/tab and launch the application
      			},
    
      			{"caption":"-"}
      		]
      	}
      ]
    
  • StringEncode encodes and decodes strings of text.

  • Project Manager makes saving and opening project much easier. In the Project Manager User Settings, I like to do the following (you'd want to update the path for your purposes):

      {
          "projects_fpath": ["/Users/jfentress/Dropbox/Projects/sublime projects"],
          "show_recent_projects_first": true
      }
    

and I like to update my user keymappings to:

    [
        { "keys": ["super+shift+space"], "command": "expand_region" },
        { "keys": ["super+ctrl+p"], "command": "project_manager" },
        { "keys": ["super+ctrl+o"], "command": "project_manager", "args": {"action": "new"} }
    ]
  • ExpandRegion expands the current selection to include the next level of scope. Be sure to assign a keyboard shortcut following the instructions. I prefer the recommended binding (see above for my keybinding file).

  • EditorConfig helps developers maintain consistent coding styles between different editors.

  • FindResultsApplyChanges does two things: 1) it let's you make changes and save files from the Find in Project tab and 2) it automatically adds excludes from the "binary_file_patters" object in preferences to the find in project "where" field. I don't like the double-click functionality, so I like to add this to the FindResultsApplyChanges user preferences

      {
          "disable_double_click": false
      }
    

Customize settings

In the File Menu, go to SublimeTextPreferencesSettings – User. It opens a JSON file with some options. Here's my setup. Go through and comment on/off each one to see what it does.

{
	// Documentation on Auto Complete - http://www.sublimetext.com/docs/3/auto_complete.html
	"auto_complete": true,
	"auto_complete_commit_on_tab": true,
	"auto_complete_with_fields": true,
	
	// show these files/folders in the sidebar, but exclude them from Go to File or Find in Project
	"binary_file_patterns":
	[
		"*.jpg",
		"*.jpeg",
		"*.png",
		"*.gif",
		"*.ttf",
		"*.tga",
		"*.dds",
		"*.ico",
		"*.eot",
		"*.pdf",
		"*.swf",
		"*.jar",
		"*.zip",
		"*.map",
		"*.min.js",
		"css/"
	],

	// make the sidebar a little easier to glance at
	"bold_folder_labels": true,

	// color scheme
	"color_scheme": "Packages/User/peacock-contrast (SL).tmTheme",

	// exclude junk folders
	// also exclude WordPress core and Jekyll site directories
	"folder_exclude_patterns":
	[
		"bin",
		".svn",
		".git",
		".hg",
		"CVS",
		"tmp",
		".bundle",
		"wp-admin",
		"wp-includes",
		"_site",
		"node_modules",
		".sass-cache"
	],

	// font and font size
	"font_face": "Source Code Pro", // download from https://github.com/adobe/source-code-pro
	"font_size": 15.0,

	// highlight the current line
	"highlight_line": true,

	// add a little space between lines of code
	"line_padding_bottom": 1,
	"line_padding_top": 1,

	// spell check enabled
	"spell_check": true,

	// tabbing and handling tabs
	"tab_size": 4,
	"translate_tabs_to_spaces": true,
	"trim_trailing_white_space_on_save": true,

	// I like word wrap, all the time
	"word_wrap": true
}

You'll also want to make it so trailing space isn't trimmed in Markdown files. See http://robandlauren.com/2013/11/21/configuring-sublime-text-markdown/ for more details.

Favorite features

Everybody has their favorite built-in features, here are mine:

  • ~$ subl .: You can symlink a SublimeText command line tool that can open folders you've navigated to Terminal. If you want a more graphical approach, drag a folder onto the icon.
  • +t: Quick open files. Just start typing the filename you want. No more folders. Glorious.
  • +f: Find in File. Bonus: Hitting alt+return to "Find All" will multi-select all instances of the search term. Start editing instantly.
  • +Shift+F: Find in Project. Great for grepping redundancies, finding !importants, and more. In the results, click the file location to open it.
  • +D: add the next instace of the selected text to the current selection. It's like doing a find an replace on a portion of a file by selection, hitting +D to get all appropriate instaces, and then typing to replace.
  • ctrl+Shift+W: wraps selection with tag.
  • +Shift+Space: expands the region of the selection (much better if you have the ExpandRegion package installed and setup as indicated above).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment