タグ

gulpに関するquanonのブックマーク (6)

  • gulp:とりあえず覚えておきたい、よく利用する基本タスクの記述サンプル - NxWorld

    主にこれからgulpを使い始めよう(使い始めた)という人向けに、とりあえず覚えておきたいよく利用するタスクの基的な記述例やプラグイン・モジュールを使った使用例をいくつかまとめてみました。 実際に使用する時はここで紹介しているような簡易的なものでなく、もっと複雑なタスクだったり様々なプラグイン・モジュールを組み合わせたりすることがほとんどですが、ファイルの移動や削除をはじめ、リネーム・結合・圧縮・監視など基となるような処理の記述方法や動きを知りたい人は参考にしてみてください。 gulpの基的な使用方法(環境準備やインストールなど)については割愛しています。 また、以下はいずれもgulpfile.jsに記載した例になり、ファイル指定のディレクトリは/src、出力先のディレクトリは/publicという想定になります。 ここで紹介している内容は、gulp Ver 3.9.1を使用した場合にな

    gulp:とりあえず覚えておきたい、よく利用する基本タスクの記述サンプル - NxWorld
  • タスクランナーgulp.js最速入門 - id:anatooのブログ

    相変わらず仕事ではデザインやりつつJavaScript書いている。 タスクランナーとしてGrunt.jsを使っていたけれども、使ううちに段々不満がでてきた。遅かったり、記述が冗長になりがちでつらかったので最近になってgulpに乗り換えた。 gulpは良い。タスクは自動的に並列に実行され、かつストリームで処理されるので速いし、タスクの記述もストリームベースの書き方のおかげでGrunt.jsに比べるとだいぶ短くなる。 ただ、そこらにあるgulpをちょっと試しただけの日語の記事やドキュメントをみてても実際のプロジェクトで使えるレベルまでの知識を得られず学習に一日かかった。 この記事では、gulpをまともに使えるようになるまでに必要な知識を書く。 導入とHelloWorld まずは導入。npmからgulpをインストールする。 $ npm install gulp -g $ gulp -v [gu

    タスクランナーgulp.js最速入門 - id:anatooのブログ
    quanon
    quanon 2015/12/04
  • gulp と browserify と vinyl の話 - <body>

    browserify の API が変わったので、この記事のコードのままでは動きません! gulp で browserify しようとしたんだけど、 色々ハマったので、 ひとまずまとめておきたい。 登場人物 gulp ちゃん フロントエンドのビルドエンジン。 grunt を馬鹿にしてる。 browserify ちゃん CommonJS スタイルの require をフロントエンドでも使えるようにする npm モジュール。 調子に乗ってるけど webpack がきになる。 vinyl ちゃん npm 全般で使うオブジェクトの名前。モナドを感じる。 俺がさっき知った。 gulp の仕組み そもそも gulp って、確かに grunt より短く書けるけど、 具体的になにしてるのかよくわかんねーよ! って思ったので、 まず、この短いコードから考えていきたい。 var gulp = require(

    gulp と browserify と vinyl の話 - <body>
  • Rails + React + ES6 のためのアセット環境構築 - 破いて捨てたノート

    結論 Sprocketsの動作を維持しつつ、npmgulpなどのモダンなパワーも取り入れた、いいとこどりな環境を構築してみた。 やりたいこと SEOのため、Reactでserver-side renderingをしたい JSコードをES6で記述したい 既存のCoffeeScriptのコードも共存させたい(後ほど書き換える予定) npmgulpといったモダンな環境でアセット管理をしたい browserifyを使いたい Sprocketsが実現している機能は維持したい そもそもSprocketsは何をしているか 周知のことでしょうが念のためおさらい。 ファイル毎の依存関係の管理 application.jsなどのマニュフェストファイルがやってること altJSのコンパイル アセットのminify アセットの連結 アセットファイル名にMD5フィンガープリントを挿入 Sprocketsの問題点

    Rails + React + ES6 のためのアセット環境構築 - 破いて捨てたノート
    quanon
    quanon 2015/09/11
    これ試したいな。
  • 開発に便利なタスクランナー「gulp」で出来る事、導入方法などをまとめました |https://wp.yat-net.com/name

    2015年 09月 10日 開発に便利なタスクランナー「gulp」で出来る事、導入方法などをまとめました カテゴリ: gulp タグ:gulpタスクランナー タスクランナーの一つであるgulp(ガルプ)。使い出すとすごく便利で今ちょっと手放せない開発ツールの一つなんですが、使ってない人からすると、導入コストとか学習コストが気になって、まだ手を出してないという方もいますよね。なので、今回導入用の記事を書いたので、ちょっと気になってるという方、試してみたかったという方に役立てばいいなと思います。 1.タスクランナーとは? gulpで何ができるのか? 2.gulpに必要な環境を整える – Node.jsのインストール 3.gulpに必要な環境を整える – package.jsonの作成 4.gulpに必要な環境を整える – gulpfile.jsの作成 5.gulp-ejsを使った開発環境 6.

    開発に便利なタスクランナー「gulp」で出来る事、導入方法などをまとめました |https://wp.yat-net.com/name
  • Gulp on Rails: Replacing the Asset Pipeline | Viget

    Just over a year ago I started using Gulp and created gulp-starter. The setup works great out of the box on projects that are unopinionated about assets. Rails, unfortunately, is very opinionated, and it's taken me a year of trial and error to land on a solution that fully integrates a Gulp-based asset pipeline with Rails without compromising existing features or sacrificing speed, power, or flexi

    Gulp on Rails: Replacing the Asset Pipeline | Viget
  • 1