Angular Example

目黒JavaScriptもくもく会 #6 - connpass でもくもくした Angular 公式チュートリアル のリポジトリです。

$ npm install
$ npx ng serve
htts://localhost:4200

VSCode用に下記設定を追加しています。

• TSLintの自動修正(.vscode/settings.json)
• VSCodeデバッグ(.vscode/launch.json)

VSCodeデバッグ

• $ npx ng server で開発サーバーを立ち上げる
• VSCodeのDebugから Launch Chrome against localhost を実行
• VSCodeの止めたい箇所にブレイクポイントを設定

参考:

• 【Angular】VS Codeでデバック設定

VSCode拡張

下記のExtensionを入れると開発がはかどりました。

• Angular Language Service - Visual Studio Marketplace
  • Angular公式が開発、基本的な機能を提供してくれる。必須。
    • コンポーネントの補完
    • コンポーネント定義元にジャンプ
    • HTMLタグ内でコンパイルエラーを出す
• vscode-angular-html - Visual Studio Marketplace
  • AngularのHTMLテンプレートをシンタックスハイライトしてくれる。必須。
• Angular Files - Visual Studio Marketplace
  • VSCode Explorerから右クリックで各種generateコマンドを実行できる。