10 pacotes de texto sublimes para desenvolvedores de front-end
O Sublime Text é um dos mais poderosos editores de código com alguns recursos incríveis, e pode ser ainda mais poderoso com a instalação Plugins ou Pacotes. Esses plugins adicionam funcionalidades extras ao Sublime Text. E hoje existem muitos plugins para atender praticamente qualquer uma das suas necessidades de codificação.
Encontrar uma boa extensão embora poderia ser um verdadeiro desafio; algumas extensões foram completamente abandonadas por seus desenvolvedores, enquanto outras podem não ser mais compatíveis com o Sublime Text 3, a versão mais recente (no momento desta publicação).
Se você é um desenvolvedor frontend, selecionamos algumas extensões e as reunimos para você neste artigo. Esses são 10 Pacotes de Texto Sublime Os desenvolvedores frontend devem experimentar.
Mais sobre Hongkiat.com:
- 18 plugins essenciais para tirar mais proveito do SublimeText
- [How To] Trabalhar com trechos de código no texto sublime
- [How To] Atualizar alterações no navegador com Sublime Text
- [Como para] Identificar erro de código no texto sublime
- Coleta fácil de cores em texto sublime
1. AlignTab
AlignTab é um plugin para alinhar seus códigos. Tem um “Modo de pré-visualização” que permite ver como o alinhamento será aplicado (dada a notação RegEx) antes de ser aplicado. Ele também tem o “Modo de tabela” permitirá que você defina o alinhamento adequado para tabelas no formato Markdown, estruturado com pipelines: |
. AlignTab é uma extensão útil para arrumar o alinhamento do código e facilitar a leitura.
![](http://savtec.org/img/images_2/10-sublime-text-packages-for-frontend-developers.jpg)
2. ColorHighlighter
ColorHighlighter é um plugin que mostra códigos de cor selecionados com sua cor visual. Se você selecionar “#fff” ele mostrará a cor, branco. O ColorHighlighter suporta todos os formatos de cores CSS, como Hex, RGB, HSL, HSV, e inclui palavras-chave coloridas como “vermelho”, “verde”, Também mostra as variáveis LESS, Sass e Stylus que contém um valor de cor. É um plug-in que ajudará você a ser mais intuitivo ao trabalhar com cores.
![](http://savtec.org/img/images_2/10-sublime-text-packages-for-frontend-developers_2.jpg)
3. MultiEditUtils
Plugin MultiEditUtils melhora o built-in SublimeText “multi-cursor” e “multisseleção” recurso, economizando tempo para editando longas linhas de código. Por exemplo: você pode mesclar ou trocar entre linhas selecionadas, também melhora o SublimeText “seleção dividida” permitindo que você especifique a notação para dividir as linhas selecionadas. Eu acho que é necessário ter um plugin para instalar pro codificadores.
![](http://savtec.org/img/images_2/10-sublime-text-packages-for-frontend-developers_3.jpg)
4. Calha do Git
Se você estiver trabalhando com o Git, o Git Gutter é um plugin Sublime Text recomendado para instalação. GitGutter mostrará uma bandeira na área da calha, de qualquer edições, adições ou remoção feitas em seu código. É um código útil para ver instantaneamente a comparação entre sua edição de código e o commit, branch ou repositório HEAD.
![](http://savtec.org/img/images_2/10-sublime-text-packages-for-frontend-developers_4.jpg)
5. Modific
Modific é útil quando você está usando o Git ou o SVN no seu trabalho. Assim como o GitGutter, o Modific marcará uma mudança em seus códigos. Além de destacar as alterações, você também pode visualizar ou comparar a diferença entre o código atual e o último commit pressionando Ctrl + Alt + D. Outras coisas que você pode fazer com o Modific incluem pré-visualize o código confirmado para a linha atual assim como reverter modificações no código.
![](http://savtec.org/img/images_2/10-sublime-text-packages-for-frontend-developers_5.jpg)
6. Valor Inc Dez
Inc Dec Value permite que você aumentar ou diminuir números simultaneamente, mesmo se eles estiverem em linhas diferentes. Além de números, você também pode alterar o valor das datas e as cores HEX. Para usar este plugin em geral, direcione o cursor para a direita do número e pressione Alt + ↑ para aumentar o número ou Alt + ↓ para diminuir o número. Você também pode usar a roda do mouse.
![](http://savtec.org/img/images_2/10-sublime-text-packages-for-frontend-developers_6.jpg)
7. FileBrowser
FileBrowser oferece uma nova maneira de navegue seus arquivos e pastas dentro do diretório do seu projeto. Quando você instala este plugin, você pode ter acesso ao diretório do seu projeto em uma nova barra lateral, e navegar por ele sem mover suas mãos do seu teclado - como um pro-codificador. À medida que você se acostuma, este plugin pode aumentar gradualmente seu fluxo de trabalho.
![](http://savtec.org/img/images_2/10-sublime-text-packages-for-frontend-developers_7.jpg)
8. IconFont
O IconFont fornece trechos para muitas fontes de ícones populares, como FontAwesome, PaymentFont, Typicons e Github Octicons. Ele funciona de maneira semelhante aos snippets HTML regulares abreviaturas serão expandidas para o comprimento total de classes e código HTML para cada ícone.
![](http://savtec.org/img/images_2/10-sublime-text-packages-for-frontend-developers_8.jpg)
9. DistractionFreeWindow
Embora o Sublime Text esteja embutido “Distração Livre” recurso permite que você se concentre no código ou conteúdo que está digitando, quando você está nesse modo, o minimapa, a barra lateral e todas as outras guias estão ocultos. Distração livre não significa perder o acesso a esses recursos. É aqui que o DistractionFreeWindow entra para dar mais flexibilidade em termos de como o Modo Sem Distração deve se comportar.
![](http://savtec.org/img/images_2/10-sublime-text-packages-for-frontend-developers_9.jpg)
10. FilterLines
O FilterLines permite que você pesquise através das linhas dentro do seu documento para o dado “string de palavra-chave” ou “Notação RegEx”. É um recurso útil para lidar com uma grande quantidade de dados brutos na forma de JSON, JavaScript Array, CVS.
![](http://savtec.org/img/images_2/10-sublime-text-packages-for-frontend-developers.gif)