Configurações para o Sublime como IDE para PHP / JS

gistfile1.txt

Finalmente, agora eu tenho tudo quase perfeito com o Sublime, só me falta mesmo é um Outline para fechar de vez.

Segue relação dos plugins que estou utilizando com o Sublime, bem como minhas configurações:

O primeiro package a instalar é o Package Control. A partir dele é possível intalar todos os outros pacotes executando Cmd+Shift+P (ou Ctrl para quem usa Linux/Windows), e buscando por "Package Control:Install Package".

Para instalar o Package Control, execute as instruções contidas nesta página:
https://packagecontrol.io/installation

Agora, chame o comando de instalação de pacotes e instale os seguintes pacotes.

Essenciais para qualquer configuração:
- BracketGuard
- BracketHighlighter
- DocBlockr
- Emmet
- Package Control
- SideBarEnhancements
- WordHighlight
- SyncedSideBar
- Terminal
- CodeFormatter (definir "jslint_happy": true, "end_with_newline": true, "preserve_newlines": true, "max_preserve_newlines": 1, desativar para PHP)
- SublimeLinter
    -annotations
    -php
    -jshint
    -jscs
- phpfmt (formatação automática para PSR1 e 2 ao salvar)
- HTML5
- jQuery
- Pretty JSON
- Pretty YAML
- SublimeCodeIntel
- PHPIntel
- PHP-Twig
- Twig
- AngularJS
- AngularJS Snippets
- ng-snippets
- LESS
- GitGutter
- GitSavvy

Instale agora o tema Spacegray Midnight, disponível em: https://github.com/phackwer/spacegray, fazendo o download como ZIP e descompactando-o dentro da sua pasta de Packages (busque browse packages no seu menu de preferências de acordo com sua plataforma - no Mac, Sublime Text > Preferences > Browse Packages), em uma pasta chamada "Theme - Spacegray".

Para a fonte, estou usando atualmente a Consolas com tamanho 14, mas a Andale Mono também é muito boa. Altere o tamanho da fonte de acordo com sua resolução e tamanho de tela. Estou usando um Mac de 17" 1920x1200, por isso esotu usando tamanho 14 atualmente.

Após instalar estes pacotes, configure seu ambiente para melhor apresentação do texto no Mac (no Windows, coloque outra fonte que lhe agrade) abrindo o arquivo de preferências do usuário e colocando o seguinte conteúdo:

{
	"auto_ident": true,
	"bold_folder_labels": true,
	"caret_style": "phase",
	"color_scheme": "Packages/Theme - Spacegray/base16-midnight.dark.tmTheme",
	"detect_indentation": false,
	"draw_white_space": "selection",
	"font_face": "Andale Mono",
	"font_options":
	[
		"no_antialias"
	],
	"font_size": 12,
	"highlight_line": true,
	"ignored_packages":
	[
		"Vintage"
	],
	"indent_subsequent_lines": true,
	"indent_to_bracket": true,
	"line_numbers": true,
	"line_padding_bottom": 2,
	"line_padding_top": 2,
	"preview_on_click": true,
	"shift_tab_unindent": true,
	"show_full_path": true,
	"spacegray_sidebar_tree_small": true,
	"tab_size": 4,
	"theme": "Spacegray Midnight.sublime-theme",
	"translate_tabs_to_spaces": true,
	"trim_automatic_white_space": true,
	"trim_trailing_white_space_on_save": true,
	"use_tab_stops": true,
	"word_separators": "./\\()\"'-:,.;<>~!@#%^&*|+=[]{}`~?",
	"word_wrap": false
}


No linux, utilize estas configs para fontes:

	"font_face": "DejaVu Sans Mono",
	"font_size": 11,
    "font_options":["no_antialias"],

IMPORTANTE! Depois de alterar as configurações, reinicie para que a sidebar pegue as configs do tema! Ou vc vai ter uma barra lateral cinza.

Agora vamos colocar o keybinding para Eclipse (trocar super por ctrl para o windows)

[
    { "keys": ["super+d"], "command": "run_macro_file", "args": {"file": "Packages/Default/Delete Line.sublime-macro"} },
    { "keys": ["super+shift+c"], "command": "toggle_comment", "args": { "block": false } },
    { "keys": ["super+shift+f"], "command": "reindent" , "args": {"single_line": false}},
    { "keys": ["ctrl+space"], "command": "auto_complete" },
    { "keys": ["super+shift+r"], "command": "show_overlay", "args": {"overlay": "goto", "show_files": true} },
    { "keys": ["ctrl+tab"], "command": "next_view" },
    { "keys": ["super+alt+left"], "command": "prev_view_in_stack" },
    { "keys": ["super+alt+right"], "command": "next_view_in_stack" },
    { "keys": ["ctrl+tab"], "command": "next_view" },
    { "keys": ["ctrl+shift+tab"], "command": "prev_view" },

    { "keys": ["super+t"], "command": "open_terminal" },
    { "keys": ["super+alt+t"], "command": "open_terminal_project_folder" },
    { "keys": ["super+shift+t"], "command": "reopen_last_file" },
    { "keys": ["super+shift+f"], "command": "code_formatter"}
]

Sabe um dos melhores recursos que tem para abrir uma definição de classe, método ou algo assim, apertando o ctrl e clicando? Também dá para fazer no Sublime. A tecla padrão é a F12, mas como eu não gosto de mudar o comportamento das minhas teclas, e apertar fn+F12 é chato, eu resolvi correr atrás de como fazer isso com alt+click (porque ctrl+click é o botão direito e não quero perder isso). E encontrei. Mudei o mapeamento para ser a tecla alt+click, então, se for fazer em outro OS, lembre-se de mudar de volta para ctrl.

Mac - create "Default (OSX).sublime-mousemap" in ~/Library/Application Support/Sublime Text 3/Packages/User
Linux - create "Default (Linux).sublime-mousemap" in ~/.config/sublime-text-3/Packages/User
Win - create "Default (Windows).sublime-mousemap" in %appdata%\Sublime Text 3\Packages\User

[
    {
        "button": "button1", 
        "count": 1, 
        "modifiers": ["super"],
        "press_command": "drag_select",
        "command": "goto_definition"
    }
]

E vamos configurar o SideBarEnhancements para abrir arquivos com seus respectivos editore/visualizadores

[
    {"id": "side-bar-files-open-with",
        "children":
        [

            //application 1
            {
                "caption": "XMind",
                "id": "side-bar-files-open-with-xmind",

                "command": "side_bar_files_open_with",
                "args": {
                                    "paths": [],
                                    "application": "XMind.app", // OSX
                                    "extensions":"xmind",  //any file with these extensions
                                    "args":[]
                                },
                "open_automatically" : false // will close the view/tab and launch the application
            },


            //application 2
            {
                "caption": "SeaMonkey",
                "id": "side-bar-files-open-with-openproj",

                "command": "side_bar_files_open_with",
                "args": {
                                    "paths": [],
                                    "application": "OpenProj.app", // WINNT
                                    "extensions":"xml", //open all even folders
                                    "args":[]
                                },
                "open_automatically" : false // will close the view/tab and launch the application
            },
            //application n
            {
                "caption": "Preview",
                "id": "side-bar-files-open-with-chrome",

                "command": "side_bar_files_open_with",
                "args": {
                                    "paths": [],
                                    "application": "Preview.app",
                                    "extensions":".*", //any file with extension
                                    "args":[]
                        },
                "open_automatically" : false // will close the view/tab and launch the application
            },
            //application n
            {
                "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":"-"}
        ]
    }
]

Instale o jscs com o comando:

npm install -g jscs

Crie um arquivo no seu home chamado .jscsrc e coloque o seguinte conteúdo (by Daniel Luz - Bill):

{
    "excludeFiles": [
    "node_modules/**/*",
    "Resources/public/vendor/**/*"

    ],
    "requireCurlyBraces": [
    "if",
    "else",
    "for",
    "while",
    "do",
    "try",
    "catch"

    ],
    "requireParenthesesAroundIIFE": true,
    "requireCommaBeforeLineBreak": true,
    "requireCamelCaseOrUpperCaseIdentifiers": "ignoreProperties",
    "requireDotNotation": "except_snake_case",
    "requireSpacesInForStatement": true,
    "requireSpaceBetweenArguments": true,
    "maximumLineLength": {
     "value": 120,
     "tabSize": 4,
     "allExcept": [
     "urlComments",
     "regex"

     ]

    },
    "disallowMixedSpacesAndTabs": true,
    "disallowTrailingWhitespace": true,
    "disallowMultipleLineStrings": true,
    "disallowTrailingComma": true,
    "requireSpaceBeforeBlockStatements": true,
    "requireSpacesInFunctionExpression": {
     "beforeOpeningCurlyBrace": true

    },
    "requireSpaceAfterKeywords": [
     "if",
     "else",
     "for",
     "while",
     "do",
     "switch",
     "return",
     "try",
     "catch"

    ],
    "requireSemicolons": true,
    "requireSpacesInConditionalExpression": true,
    "requireSpaceAfterBinaryOperators": true,
    "requireLineFeedAtFileEnd": true,
    "requireSpaceBeforeBinaryOperators": true,
    "requireSpacesInAnonymousFunctionExpression": {
     "beforeOpeningCurlyBrace": true

    },
    "requireSpacesInNamedFunctionExpression": {
     "beforeOpeningCurlyBrace": true

    },
    "validateLineBreaks": "LF",
    "disallowKeywords": [
     "with"

    ],
    "disallowKeywordsOnNewLine": [
     "else"

    ],
    "disallowSpacesInsideObjectBrackets": "all",
    "disallowSpacesInsideBrackets": true,
    "disallowSpacesInsideParentheses": true,
    "disallowSpacesInFunctionExpression": {
     "beforeOpeningRoundBrace": true

    },
    "disallowSpacesInNamedFunctionExpression": {
     "beforeOpeningRoundBrace": true

    },
    "disallowSpacesInAnonymousFunctionExpression": {
     "beforeOpeningRoundBrace": true

    },
    "disallowSpaceAfterObjectKeys": true,
    "disallowSpaceAfterPrefixUnaryOperators": true,
    "disallowSpaceBeforePostfixUnaryOperators": true,
    "disallowSpaceBeforeBinaryOperators": [
     ",",
     ":"

    ]

}


Instale o jshint com o comando:

npm install -g jshint

Crie um arquivo no seu home chamado .jshintrc e coloque o seguinte conteúdo (by Daniel Luz - Bill):

{
    "eqeqeq": true,
    "eqnull": true,
    "laxbreak": true,
    "maxstatements": 50,
    "newcap": false,
    "noarg": true,
    "strict": true,
    "undef": true,
    "unused": "vars",
    "curly": false, // verificado por JSCS
    "asi": true, // verificado por JSCS
    "globals": { // variáveis sempre acessadas (read-only)
        "angular": false,
        "_": false,
        // constante fixa em modo dev/prod
        "DEBUG": false,
        // funções globais
        "Xys": false,
        // roteador JS
        "XysDefineRoutes": false,
        // globais legados
        "Modal": false
    }
}

Top mano!