現場で使えるgulp入門 第1回 gulpとは何か さまざまな作業を自動化するビルドシステムgulpの基礎を解説します。第1回目は、gulpとは何か? 自動化のメリットはどこにあるのか概観。インストールから簡単なタスクを走らせてみます。 はじめに このシリーズでは、JavaScriptで書かれたビルドシステムであるgulp(ガルプ)について、導入から使い方など、基本的な部分を解説します。 なお、記事執筆時点のgulpのバージョンは3.8.7です。 第1回目では、まず、なぜgulpのようなツールが必要なのか、ツールの背景に触れます。さらにgulpの概要と、環境設定を中心に解説します。 gulpとは gulpはNode.jsをベースとしたビルドシステムヘルパーです。以前CodeGridでも紹介したGruntと似た目的を持って作られたツールで、gulpを使えばさまざまな作業を自動化することができ
Gulp is a tool that helps you out with several tasks when it comes to web development. It’s often used to do front-end tasks like: Spinning up a web server Reloading the browser automatically whenever a file is saved Using preprocessors like Sass or LESS Optimizing assets like CSS, JavaScript, and images Important Note! This article was written for Gulp 3.x, but now Gulp 4.x is out and recommended
こんにちは、清田です。 最近、フロントエンド開発においてGruntにお世話になっている方も多いかと思います。 私も日ごろ大変お世話になっています。私としては、Gruntにあまり不満はないのですが、多少体感としてちょっと遅いかなぁくらいの印象を持つくらいでした。 そんな中、タスクランナーツールとして後発ながらGulp.jsという名前を聞くようになってきたので、実際に試してみました。 Gulp.jsとは? Gulp.js公式サイト 皆さんご存知のフロントエンド開発でタスクランナー&ビルドツールとして有名なGrunt.jsですね、弊社ブログでも何度かご紹介させていただいたかと思います。 Gulp.jsも同じく、タスクランナー&ビルドツールとしての立ち位置とのこと。 Gruntと何がちがうの? いろいろなエントリーを拝見し以下の意見がありました。 ビルドファイルが書きやすい 並列処理のため、実行速
有名なビルドツール(タスクランナー)であるGruntを使ってみようとずっと思っていて放置していたら 今は同様のタスクランナーとしてgulpという方が人気のようなので、そっちを触ってみました。 はじめに(リファレンスとか) gulpはGruntと同じくタスクランナーと呼ばれるものの1つです。 Sassのコンパイルやjsファイルの圧縮などの様々なタスクを自動で行ってくれます。 gulpはnode.jsで開発されているので、npmによりインストールできますが、 gulpそのものには上に挙げたタスクを行うための特定の機能は何も含まれていません。 自分がやりたいことに応じて、別途gulp-xxxというパッケージをnpmでインストールして使うことになります。 今回最初に参考にしたのがこちらのスライド。 Gulp入門 - コーディングを10倍速くする from Hayashi Yuichi このスライド
タスクランナーgulp入門 gulpはGruntと同じように様々なタスクを自動化してくれるツール(タスクランナー)です。 node.jsで開発されており、Sass/CompassやLess、StylusなどのCSSプリプロセッサーのコンパイルやCSS/JSの結合圧縮、JSHintによるバリデーションなど様々なタスクを自動で行ってくれます。 Gruntとできることはほとんど同じですが、Gruntよりタスクの流れがわかりやすく、JavaScript(node.js)で独自のタスクも簡単に記述することができます。 後発ということもありGruntよりプラグイン数は少ないですが、マニアックなタスク以外はそろっているので通常のWeb制作などでは問題なく利用できるでしょう。 node.jsのインストール node.jsが必要ですのでインストールしていない方はインストールしましょう。 公式サイトでインスト
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く