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

package.jsonファイルをつくる

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
NPMでパッケージを管理するためのファイルとして、package.jsonをつくります。
講師:
03:35

字幕

このレッスンでは、npmnode package manager でパッケージを管理するためのファイルpackage.json を作りたいと思います。まず、プロジェクトを管理するためのフォルダとしてgulp という名前のものを作っています。これはユーザのフォルダの中にあります。まだ今空っぽです。ここに、package.jsonという json ファイルを作ります。json ファイルですから普通にエディタで作ってもいいですけれどもこのコマンドラインツールから命令を入力するだけで、自動的に作ってくれる便利な命令があります。まずは、プロジェクトのフォルダですねここにディレクトリを変更しなくではいけません。これは change directoryという意味なんですけれともcd で先ほど gulp というフォルダが作ってありましたね。そこに、変更します。そうすると、gulp と出てきて変更はできました。この中に、json ファイルを作ります。npm のコマンドです。npm initinitialize の頭でしょうね。これを入力すると質問がいっぱい出てきます。その質問に随時答えて行けばいいんですが多くはデフォルトが決まっています。 まず「name:(gulp)」となっていますけれどもこれはフォルダ名が自動的に入ります。もし違う名前をつけたければ付けてもいいんですがここはデフォルトでいってしまいましょう。次に、version です。1.0.0 がデフォルトです。この name と version 2項目は入力が必須となっています。後は入れても入れなくてもオプションなんですけれどもdescription ではproject for gulpぐらいしておきましょうか。この入力は任意です。それから entry pointここはもうデフォルトでいってしまいましょう。test command もデフォルトです。git repositoryここももし必要があれば入力してください。keyword も同様です。authorギブと名前ぐらい入れましょうか。ということで、後は license です。ISC がデフォルトになっていますがMIT を使うことも多いのではないでしょうか。そうすると、こんな感じで作りますけれどもいいですかという確認が最終的に出てきます。yes の場合 Y なんですがyes がデフォルトですのでここも Enter でいけてしまいます。 さて、プロンプトに戻りましたのでファイルが作成できました。さて、先ほど空っぽだったフォルダgulp を見てみるとpackage.json が出来上がっていますね。一応内容を確認しましょうか。Deamweaver CC 2015 で開いてみます。ターミナルで最終的にこれでいいですかと確認された通りですけれどもこの様になっています。デフォルトの部分は勝手にデフォルトの内容を入れてくれるということが確認できたかと思います。このレッスンでは、npm でパッケージを管理するためのファイルとしてpackage.json というファイルの作り方についてご説明しました。その場合にはコマンドラインツールでnpm の命令であるワンスペースInit ですね、これを入力して後は質問に答えていけば自動的にその json ファイルが出来上がるというご説明でした。

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

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

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

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

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

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