メインコンテンツへ移動
黯羽軽揚毎日少しずつ

Sublime ガイド

無料2015-05-28#Tool#前端IDE#sublime#sublime插件

Sublime はずっと前にインストールしました。同業者がみんな使っていると聞いたからです。最近ようやく Notepad++ を見捨てて Sublime に乗り換えることにしました

はじめに

之前はずっと notepad++ を使っていました。まあまあ良い感じでした。后来、周りの人たちが自分よりずっと速くコードを書いていることに気づき、少し納得いかず、プラグインを探すことにしました。より良いコード補完プラグインを見つけて効率を上げようと思いました。探し回った結果、npp をアンインストールして sublime に乗り換えることにしました。。

P.S.そのまた前は Dreamweaver を使っていましたが、后来、数千行のソースコードファイルを編集すると理由もなくクラッシュすることに気づき、我慢できなくなり、軽快な npp に乗り換えました。sublime も早就にインストールしていましたが、インターフェースが npp ほど見やすくなかったのでずっと使っていませんでした

一.Sublime の優勢

実は npp を見捨てる最も直接的な理由は、注釈テンプレートを生成できるプラグインが見つからなかったことです（Eclipse の Alt + Shift + j のようなもの）。フロントエンド開発において注釈は非常に重要で、便利なプラグインがないのは絶対に受け入れられません

プラグインを探す過程で、多くのプラグインが PHP/Python 向けで、フロントエンド向けのプラグインは少なく、しかも使いやすいものが全く見つかりませんでした。コード補完/注釈生成はおそらく QuickText プラグインで実現できるかもしれませんが、それでも比較的面倒です

Sublime が最も人を引きつけるのは、おそらくCtrl + pが提供する超便利な機能でしょう。@を入力すると関数/変数が表示され、:n を入力すると第 n 行にジャンプします。これらのシンプルな機能は npp では少なくとも 2-3 個のプラグインが必要で、プラグインが 1 つ増えるごとにショートカットキーの組み合わせを 1 つ多く覚える必要があります

もちろん、npp にも亮点があります。例えば標準搭載の Launch in Chrome/IE/FF などです。Sublime ではプラグインをインストールしないと実現できません

npp を見捨てる最大の理由は、npp のフロントエンドプラグインが十分でないことです。多くのプラグインは早就に更新が停止しており、一方 Sublime のフロントエンドプラグインは元々多く、しかも増え続けています

P.S.Sublime の有料問題については心配いりません。永久に試用できると言われています。たまにポップアップが表示されるだけです。もちろん、还有一种东西叫做注册码。。

二.Sublime のインストール

公式サイト：http://www.sublimetext.com/

ダウンロードしてインストールするだけです。現在の安定バージョンは 2.0.2 です。登録コードは以下の通りです：

----- BEGIN LICENSE -----

Andrew Weber

Single User License

EA7E-855605

813A03DD 5E4AD9E6 6C0EEB94 BC99798F

942194A6 02396E98 E62C9979 4BB979FE

91424C9D A45400BF F6747D88 2FB88078

90F5CC94 1CDC92DC 8457107A F151657B

1D22E383 A997F016 42397640 33F41CFC

E1D0AE85 A0BBD039 0E9C8D55 E1B89D5D

5CDB7036 E56DE1C0 EFCC0840 650CD3A6

B98FC99C 8FAC73EE D2B95564 DF450523

------ END LICENSE ------

三.よく使うショートカットキー

###1.万能コマンド

  • Ctrl+P、万能コマンドパネル。直接アルファベットを入力してプロジェクトファイルを検索。速度が速い。

  • Ctrl+P+@を入力、js は本ファイルのすべての関数名\html はすべての id をリスト。

  • Ctrl+P+:N(N は数字) を入力、直接第 N 行にジャンプ。

###2.検索

  • Ctrl+Shift+F、プロジェクト内でキーワードを快速に検索。ack-grep のような機能。

###3.コードのコメント

  • Ctrl+/ 行全体をコメント（すでに内容を選択している場合、「Ctrl+Shift+/」と同じ効果）

  • Ctrl+Shift+/ 選択した内容をコメント

###4.コードの折りたたみ

  • Ctrl+Shift+[ コードを折りたたみ

  • Ctrl+Shift+] コードを展開

  • Ctrl+KT プロパティを折りたたみ

  • Ctrl+K0 すべて展開

###5.分割

  • Alt+Shift+1 1 欄閲覧モード

  • Alt+Shift+2 垂直 2 欄閲覧モード

  • Alt+Shift+8 水平 2 欄閲覧モード

###6.ブックマーク

  • Ctrl+F2 ブックマークを設定

  • F2 次のブックマーク

  • Shift+F2 前のブックマーク

###7.選択

  • Ctrl+L 行全体を選択（押し続けると下行を選択）

  • Ctrl+KK カーソル位置から行末まで削除

  • Ctrl+Shift+K 行全体を削除

  • Ctrl+Shift+D カーソルがある行全体を複製し、その行の前に挿入

  • Ctrl+J 行を結合（結合する複数の行を選択している場合）

  • Ctrl+KU 大文字に変更

  • Ctrl+KL 小文字に変更

  • Ctrl+D 単語を選択（押し続けると次の同じ文字列を選択）

  • Alt+F3 すべての同じテキストを一度に選択して同時編集

  • Shift+ マウス右クリック すべての同じテキストを一度に選択して同時編集

  • Ctrl+ マウス左クリック 同時に編集する複数のテキストを手動で選択

  • Ctrl+M カーソルを括弧内の開始または終了位置に移動

  • Ctrl+Shift+M 括弧内の内容を選択（押し続けると親括弧を選択）

  • Ctrl+Z 元に戻す

  • Ctrl+Y 元に戻すを回復

  • Ctrl+M カーソルを対応する括弧にジャンプ

  • Alt+. 現在のタグを閉じる

  • Ctrl+Shift+A カーソル位置の親タグペアを選択

  • Ctrl+U ソフト元に戻す

  • Ctrl+T 単語を入れ替え

  • Tab インデント 自動完了

  • Shift+Tab インデントを削除

  • Ctrl+Shift+↑ 上の行と入れ替え

  • Ctrl+Shift+↓ 下の行と入れ替え

  • Ctrl+K Backspace カーソル位置から行頭まで削除

  • Ctrl+Enter カーソル後に行を挿入

  • Ctrl+Shift+Enter カーソル前に行を挿入

四.便利なプラグイン

###1.Sublime Package Control

プラグインマネージャー。インストールしないと腰が痛くなる

###2.GBK Encoding Support

某 txt ファイルを開いて中国語の文字化けが見つかった場合、これが必要かもしれません

###3.Emmet

zenCoding のアップグレード版

指を保護する神器。Markdown のようなもの。具体的な構文

使用方法：ショートカットキー ctrl+e

###4.BracketHighlighter

対応する括弧をハイライト表示

使用方法：自動

###5.DocBlockr

注釈テンプレート生成ツール（これがなければ NPP を見捨てなかった）

使用方法：「/**」+ enter を入力して呼び出し（function の上の行でのみ効果あり）

###6.js Format

他人のコードを読むのにこれが必要

使用方法：ショートカットキー ctrl+alt+F

上記の 6 つのプラグインがあれば非常に良いでしょう

参考資料

コメント

コメントはまだありません

コメントを書く