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を動かすこと。
まとめるとこうなる。
- 拡張機能なしてBracketsを起動
- Bracketsのサンプルディレクトリにライブプレビューさせたいソースを配置※
- Brackets->メニュー ->ファイル->試験的ライブプレビューを有効にするをチェック、若しくは右帯の雷ボタン押してを有効にする。
- enjoy
※サンプルパスの位置
Macの場合は以下
/Applications/Brackets.app/Contents/samples/ja/Getting Started
Windowsの場合は以下
C:Program Files (x86)BracketssamplesrootGetting Started
AngularJsのデバッグ。 左がライブプレビュー、右がbrackets(ソースコード) |
以上、
方式に誤りがある場合はご指摘ください。