Angular2 開発環境構築

Angular-cliにjQueryを導入する

投稿日:2017年3月13日 更新日:

Angular-cliの開発環境でのjQueryの導入方法を説明します。

 

 

1.Angular-cliの導入

最初にangular-cliを導入します。angular-cliが未導入の場合は以下を参考にして下さい。
Angular2の開発環境を構築(angular-cli)

 

2.Angular2のプロジェクト作成

作業ディレクトリ(当サイトでは「C:\ng2test」)に、サンプルプロジェクトを「sample3」を作成します。プロジェクト作成は以下を参考にして下さい。

Angular2のプロジェクト作成からデプロイまで

 

3.jQueryのインストール

npmでjQueryのパッケージをローカルインストールします。[--save]オプションを指定して、package.jsonにパッケージ情報を書き込みます。

 

4.jQueryの型定義ファイルのインストール

npmでjQueryのパッケージをローカルインストールします。[--save--dev]オプションを指定して、package.jsonのdependenciesにパッケージ情報を書き込みます。

 

5.angular-cli.jsonの編集

angular-cli.jsonにjqueryのscriptsを追加します。

 

6.動作テスト確認

 

スポンサーリンク

スポンサーリンク

-Angular2, 開発環境構築

執筆者:

関連記事

クロスドメインアクセスの問題対応

クロスドメインの概要 クロスドメインアクセスを理解してWeb APIを楽しく使おう クロスドメイン制約とは javascriptでクロスドメイン対応する場合の覚書   クロスドメインでデータ ...

Angular2のデータバインディングについて

当セクションではAngular2のデータバインディングについて確認してみたいと思います。データバインディングとは、コンポーネント(ロジック部)とテンプレート(WEBコンテンツ/HTML部)との間でデー ...

Angular-cliにng2-bootstrapを導入する

Angular2の開発でbootstrapを使用するにはng2-bootsrapを導入します。ng2-bootsrapはbootstrapの機能をディレクティブやコンポーネントとして提供してくれます。 ...

angular-cliでプロジェクト作成した主要なファイルを説明

当セクションではangular-cliの「ng new」コマンドで自動作成されたプロジェクトのスケルトンの主要ファイルについて説明したいと思います。angular-cliでAngular2の開発環境を ...

SystemJSのConfig構成について

SystemJSのConfig構成はsystemjs.config.jsファイルで設定される事が多いと思います。今回はAngular2の公式チュートリアルにあるクイックスタートで使用されているsyst ...