Gulp.jsを使ってWeb開発を効率化しよう

Gulp環境の再構築

全334コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
package.jsonファイルにより、Gulp環境が再構築できます。
講師:
03:20

字幕

このレッスンではpackge.json ファイルを使ってgulp環境の再構築をする方法についてご説明をします。今 packge.json のファイルを開いています。これは設定ファイルで特にローカル環境で開発に使うdevDependencies ここに使われているモジュールとか、プラグインがどんどん登録されています。今7つがありますがインストールするときにあの devDependencies にに追加するためには例えば gulp の場合ですねgulp のモジュールですとここにありますがnpm Install のあとオプションを付けます。--save-dev そしてモジュールあるいはプラグインを指定するとそれが packge.json の中のdevDependencies に登録されるということになっています。そしてプロジェクトのフォルダを見て見るとnode_modules という中にやはり7つのモジュールプラグインのフォルダが出来上がっています。さて、ここで my project というgulp のフォルダが作りました。そこに、この今まで作ったgulp_project のpackge.json がありますがこれをコッピしてこの中に入れます。 空っぽのフォルダにpackge.json だけが収まりました。node_modules のフォルダはもちろんありません。ここで、コマンドラインツールのターミナルに移ってディレクトリを先ほどの空っぽだったpackge.json のファイルを1つ入れたmy_project に変更します。my_project に入りましたね。そして、この状態でnpm installそして、通常はモジュールやプラグインの名前を指定するわけなんですがこのまま実行してしまいます。実行の終わった画面がこちらです。少し時間がかかってしまったので実行の部分はカットしていますけれどもたくさんのモジュールがプラグインとかですねインストールされています。すると先ほどまでpackge.json しかなかったmy_project のフォルダですねここに node_modules が出来上がりました。そして、7つのモジュールやプラグインがフォルダの中に入っています。ということで、同一環境を別のマシンに或いは、チームで別の人たちの間で同じ環境を構築するということが簡単にできるんですね。このレッスンではpackge.json ファイルがあれば別の環境で、同じ開発環境gulp の設定を簡単に構築できるということについてご説明しました。 コマンドラインツールからnpm install と打って何も指定しないで実行すればいいということです。

Gulp.jsを使ってWeb開発を効率化しよう

GulpはWeb開発におけるコンパイルやビルドを自動化してくれるタスクランナーツールです。モジュールやプラグインなどを使って、ビルド用のJavaScriptファイルでタスクを定義します。このコースではGulpとプラグインのインストール、タスクの定義や画像ファイルの圧縮、JavaScriptファイルの連結やSASSによるスタイルシートの生成などを学べます。

1時間48分 (23 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2016年07月27日
再生時間:1時間48分 (23 ビデオ)

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。