Gulp 4 入門

Gulpは、ウェブサイト開発において頻繁に発生するタスク、 例えばCSSやJavaScriptファイルの最小化、 複数ファイルの単一ファイルへの結合、 LESSやSASSのCSSへの変換、 TypeScriptのJavaScriptへの変換などのタスクを 自動化するためのツールです。

その仕組みは次の通りです: Gulpシステムのためにタスクが記述され、 Gulpはそれらのタスクを指定された順序で実行します。

では、Gulpをインストールしましょう。 そのためには、コマンドラインで以下のコマンドを実行する必要があります:

terminalnpm install --global gulp-cli

次に、Gulpを使用するプロジェクトを作成しましょう。 そのためには、プロジェクトフォルダ内に次のファイル構造を作成します:

• /src//js/script1.jsscript2.jsscript3.js/css/styles1.cssstyles2.css/img/image1.pngimage2.pngimage3.pngindex.html

また、プロジェクトフォルダにpackage.jsonを 追加する必要があります。 その後、Gulpをプロジェクトにインストールできます。 そのためには、コマンドラインでプロジェクトフォルダにいる状態で、 次のコマンドを実行する必要があります:

terminalnpm install --save-dev gulp