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

開発用モジュールをローカルにインストールする

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
プロジェクトで使う開発用モジュールは、ローカルのディレクトリにインストールします。
講師:
03:43

字幕

このレッスンではプロジェクトで使う開発用のモジュールをローカルのディレクトリにインストールします。今、プロジェクト用のフォルダとして想定しているのはこの gulp_project です。これはユーザのフォルダの中に何処かにあります。今の所、package.json しかファイルありません。モジュールはこの中に入っていません。この内容を簡単に見てみましょう。殆どデフォルトのまま11行ですね。若干書き換えたところがありますけれどもデフォルトと対して変わりのない状態になっています。特に、この license の後何も入っていません。開発用のモジュールをなぜローカルのディレクトリにインストールするかというと開発を進めていく中でもしかするとgulp を始めとするモジュールのアップデートがあるかもしれません。或いは古いプロジェクトについてまた修正を加えるという時に開発のモジュールのバージョンが違ってくると不都合が出ることがあります。ですから、そのバージョンを特定してプロジェクトのフォルダの中にモジュールを入れておくとそうすると、バージョンが固定されますのでそのバージョンの違いによる不快が起こるということが防げるわけです。 コマンドラインツールの「ターミナル」を開きました。ここで、開発用のプロジェクトのフォルダの中にモジュールを入れたいと思います。まずは、ディレクトリを変えないといけませんので前ディレクトリの gulp_project ですね。そうすると、ちゃんと移りましたね。この状態でインストールを'行います。npm install gulp なんですがここにオプションが入ります。--saveこれで、package.json の中に設定が書き込まれてバージョンは特定されます。そして、これは開発用だよということを示しために更に -dev とします。そして、実行しますと警告は出てきますけれどもjson ファイルの中省略者というものがあってそれ入れないのと聞いてるだけですのでこの辺は気にしなくて結構です。どうやらプロンプトに戻りましたのでインストールができた様です。プロジェクト用のフォルダの中にnode_modules というフォルダが出来上がりました。gulp も node のモジュールとしてインストールされるからです。ちょっと開いて見ますが、開いてみるとgulp は出てきましたね。gulp のモジュールです。 あんまりきりがないのでこの辺にしておきますけれどもかなり深い入れ取りにモジュールが入っていることもあります。gulp_project に戻りましょう。package.json の方も確認しておきます。Deamweaver で見てみると先ほどまで11行で止まっていたのにdevDependencies開発用に使うものだよということでこの中括弧の中にモジュールがどんどん追加されていくんですが今回は gulp ですのでバージョンが「3.9.1」ということでこれで、開発用のバージョンが特定されることになります。このレッスンではプロジェクトで使う開発用のモジュールとしてローカルのディレクトリにgulp をインストールしました。その場合はコマンドラインツールでnpm install そこにオプションが入ります。--save-devそして、モジュール名ですが今回は gulp ということでgulp をローカルにインストールできたということです。

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

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

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

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

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

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