【メモ】Brackets

Bracketsについて。
Live Previewをやりたかったのだけれど、うまくいかなったのでメモ。

ライブプレビューが出来るHTML/JavaScript/CSSのIDEは、私の知る限りではこのBracketsとAdobe Dreamweaverしかない。Aptana Studioはstaticなプレビューのみ。

ソースをユーザディレクトリにおいた状態では、Node.jsが働くlocalhostが起動しなかった。(正確には、localhostサーバは起動しているもののデフォルトページがないような状態。)サンプルのコードでは正しく実行できたので、自分のソースをインストールパスに置くととりあえずlocalhostでの実行ができるようになった。
/Applications/Brackets.app/Contents/samples/ja/Getting Started
しかしライブでプレビューしない。一度セーブすれば更新はされるけど・・・。

いろいろ試してわかったこと。
Bracketsの内蔵Node.jsがライブプレビューとして働くには、特定のパスに置かないといけない。$PATHを通せばよいというものではないらしい?。(たとえば作業ドキュメントへの)シンボリックリンクを張ったらどうか?→シンボリックリンクは×だった。そして、必ず拡張機能なしでBracketsを動かすこと。

まとめるとこうなる。

  1. 拡張機能なしてBracketsを起動
  2. Bracketsのサンプルディレクトリにライブプレビューさせたいソースを配置※
  3. Brackets->メニュー ->ファイル->試験的ライブプレビューを有効にするをチェック、若しくは右帯の雷ボタン押してを有効にする。
  4. enjoy

※サンプルパスの位置
Macの場合は以下
/Applications/Brackets.app/Contents/samples/ja/Getting Started
Windowsの場合は以下
C:Program Files (x86)BracketssamplesrootGetting Started

AngularJsのデバッグ。 左がライブプレビュー、右がbrackets(ソースコード)

以上、
方式に誤りがある場合はご指摘ください。

関連

http://brackets.io/ -本家

参考: