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, 開発環境構築

執筆者:

関連記事

Angular2のプロジェクト作成から開発をしてIISにデプロイまで

当セクションではAngular2のプロジェクト作成し、プロジェクト開発を行い、IISへのデプロイまでを説明したいと思います。 angular-cliでAngular2の開発環境を構築している事が前提と ...

Angularjs2の公式チュートリアルにあるクイックスタートをテストしてみた

Angularjs2の公式チュートリアルにあるクイックスタートをテストしてみました。簡単にAngular2の開発環境を構築して、開発体験を行う事ができました。   目次1.事前準備2.作業デ ...

Webpackを使ったWEBフロントエンド開発

Webpackとはビルドツールの1つであり、モジュール管理ツールとしての側面も持っています。フロントエンドのビルドツールとしては、他にGulpとGruntなどがありますが、それらの仲間といった感じだと ...

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

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

SystemJSのConfig構成について

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