home wiki.fukuchiharuki.me
Menu

vimでもいいのですが、やっぱりIDEがほしい。使い慣れたEclipseでTypeScriptな環境を作ることにしました。

-- 嘘です!Atomを使うことにしました

TypEcs - TypeScript IDE for Eclipse

Quick Startのとおりでインストールできる。普通にプラグインをインストールするやり方。

NodeJSがインストールされていません

an_error.png
An error occured during TypeScript engine initialization.
TypeScript runtime requires NodeJS that should be installed separately.
It seems NodeJS is not installed or is not available in system path.

NodeJSが見つからないからTypeScriptエンジンが初期化できないそうです。いやいや、まてまて、そんなはずはない。Hello Worldやったもん。nodeもnpmも動いてるはずだよ?

  • Macを使っています
  • nodebrewでnodeをインストールしました

/usr/local/bin/nodeなら見つかった

シンボリックリンクで /usr/local/bin/node を作ってあげるとエラーはでなくなった。PATH変数をみているのではどうやらなさそう。でもこのシンボリックリンクは気持ちが悪い。共有の場所からホームディレクトリへのシンボリックリンクはさすがにイヤ。

/usr/local/bin/nodeを作る

ホームディレクトリを直に書いてシンボリックリンクを張るのは気持ちが悪いので、環境変数を使ってホームディレクトリ下のnodeに橋渡しするスクリプトを書いて置いておくことにしました。なければ呼べないだけ。

  • /usr/local/bin/node
    $HOME/.nodebrew/current/bin/node $@

システムパスにnodebrewを追加する

-- この方法では解決できていませんでした

Macのシステムパスを追加するには/etc/paths.d/にパスを書いたファイルを作成してあげればよいみたいです。

  • /etc/paths.d/node
    ~/.nodebrew/current/bin

次のようにたどれます。

  • /etc/profile から /usr/libexec/path_helper を実行している
  • path_helperは /etc/paths.d/* を読み上げている
  • /etc/paths.d/node を追加する

この記事が教えてくれました。

Validationを省く

ううん、エラーがいっぱい出るよう。動くからいいんだけど、さすがに気になるのでエラーがでないようにします。

node_modulesは見ない

node_modulesはnpmでインストールされるものなのでここはみてくれなくてもいい。くれなくてもいいというか、ここでエラー出ちゃうのって><

Include Path

  1. プロジェクトを右クリックして Properties を開く
  2. JavaScript > Include Path を選択
  3. Excluded: (None) を選択して Edit... をクリック
    include_path_1.png
  4. Exclusion patterns: の方の Add... をクリック
    include_path_2.png
  5. Browse... をクリック
    include_path_3.png
  6. ファイル一覧から node_modules を選択して OK、OK、Finish をクリック
    include_path_4.png
  7. Excluded: node_modules/ の表示を確認
    include_path_5.png

HTMLとJSON

  1. メニューの Eclipse > 環境設定... をクリック
  2. Validation を選択
  3. HTML Syntax Validator のチェックを外す(Angular2の書き方だと必ず警告が出てダルいので)
  4. JSON Validator 行の ... をクリック
    json_1.png
  5. Add Exclude Group... をクリック
  6. Exclude Group を選択して Add Rule... をクリック
    json_2.png
  7. Folder or file name を選択して Next > をクリック
    json_3.png
  8. Browse Folder... をクリック
  9. 何も選択せずそのまま 開く をクリック(ここが謎のコツ)
    json_4.png
  10. node_modules を入力して Finish をクリック
    json_5.png
  11. Exclude Group に Folder: node_modules の表示を確認
    json_6.png
添付ファイル: filejson_6.png 630件 [詳細] filejson_5.png 639件 [詳細] filejson_4.png 645件 [詳細] filejson_3.png 647件 [詳細] filejson_2.png 612件 [詳細] filejson_1.png 642件 [詳細] fileinclude_path_5.png 604件 [詳細] fileinclude_path_4.png 655件 [詳細] fileinclude_path_3.png 646件 [詳細] fileinclude_path_2.png 634件 [詳細] fileinclude_path_1.png 622件 [詳細] filean_error.png 633件 [詳細]