1.はじめに
とある、HomePageを最近作っているのですが、gulp使い始めました。
gulpについては以下のページがわかりやすいかな。
https://www.wan55.co.jp/column/detail/id=287
2.gulpインストール必要なファイル
以下のソフトをインストールしてください。ちなみに私の環境はwindows10とwindows7です。普段はwindows7で作業することが多いです。
インストールコマンドはnpmコマンドを使います。コマンドターミナル(DOS窓)から以下のように打ちます。以下のコマンドをターミナルに入力します。
npm install -g gulp npm install
「※Macはroot権限での実行が必要になるのでsudo npm install -g gulp // sudo npm install
と入力してください。」だそうです。
3.必要ファイルの設置
ホームページを作っているトップフォルダ(通常だとindex.htmlを置いてるフォルダ)に以下のgulp設定ファイルたちを作成します。(上記サイトから引用)
- gulpfile.js … タスク(処理)を定義したファイル
- package.json … タスクに必要なパッケージが記載されたファイル(
npm init
で作成可) - config.rb … compassの設定ファイル
- .gitignore … git管理対象外ファイル(Gitを使用する場合)
を設置していきます。ちなみに私はcofig.rbと.gitgnoreは作ってません。なくてもgulp使えてます。
4.gulpの起動方法
以下のようなバッチファイルを作って、作業前にダブルクリックしてます。作業フォルダがDドライブのD:\web/Tama フォルダ配下にあるのでそこまで移動した後にgulpコマンド実行して、一旦待つ感じのスクリプトです。終了させるときは、起動時に開いだDOS窓上で、^+C(コントロールキーと”C”の同時押し)で終了させてください。
rem 作成日20170921 rem xxWebページ タスクランナー起動スクリプト D: <--この辺は環境に合わせて変えてね cd \Web\Tama <--この辺は環境に合わせて変えてね gulp pause
こんな感じで