タグ

gulpに関するkohkimakimotoのブックマーク (5)

  • ytake.blog | phperだってgulp使おうぜ!

    phperだってgulp使おうぜ! Posted: 2014-12-29 23:11 | PHP全般 javascript 年末ですね タイトルがダサいですが、phpを使ってる方でgulpとかよくわからないぜ! という方向けの入門エントリです gulpとかGruntって何 gulpやgruntはタスクランナーと呼ばれるもので、 jsとかcssをminify(圧縮)したり、 coffee scriptとかtype scriptをコンパイルしたり ここ最近といっても数年前からですが、フロントエンドの進化とともに 手作業では時間がかかってたりした作業や、その他色々関連するものをタスクとして登録して それぞれを自動化させたりするものです package.json/bower.json/component.json 世間はjson祭りだ!() phpを触ってる、仕事で使ってるぜ、という方とは切っても

  • Private Presentation

    Private content!This content has been marked as private by the uploader.

  • 便利なGruntの弱点を補うgulp.jsのインストールと使い方

    詳しくは上記連載を見てもらえば分かりますが、GruntとはJavaScriptを使用してWeb開発に伴うさまざまな作業を自動化して効率良く行うためのビルドツールです。 このツールでは「タスク」と呼ばれる一連の処理を設定ファイルに記述していきます。Gruntの設定ファイル(Gruntfile.js)は、タスクに対してJSON形式でパラメーターを指定していくのですが、ここで少々問題があります。 シンプルなタスクであれば分かりやすいのですが、多くの拡張機能(プラグイン)を使用したり、タスクの制御を細かく行う必要が生じたたりした場合、Gruntfileの記述量が増えて冗長になり、タスク同士の関連やタスク実行結果も分かりにくくなってしまいます。 そんなGruntの問題点を解消することを目的として開発されたのが、今回紹介する「gulp.js」(以下、gulp)です。 gulpはGruntを継承しつつ、

    便利なGruntの弱点を補うgulp.jsのインストールと使い方
  • Browserify: それはrequire()を使うための魔法の杖 - Qiita

    JavaScript界のハリーポッターこと「Browserify」が最近元気ですね。Node.js的な var myModule = require('myModule')式の記述が、ブラウザのスクリプトでも使えるようになって、ついでに1ファイルにまとめるのもやってくれるツールです。ポストRequireJSとして期待されています。 ただ、公式ドキュメントがコマンドラインの説明に重点を置いていて、最初これだけだといまいち分かりにくい...。そこで、実際の開発で使いやすいように、ビルドツール(gulp.js)から実行するための最小構成を作ってみようかと思います。(Gruntでも同様のことは可能です) require!: Bowerも使えます 対象のスクリプトの中身は、例えばこんな感じ。この例では、ModernizrとjQueryと、独自スクリプトを組み込んでいます。外部ファイルを指定するだけで

    Browserify: それはrequire()を使うための魔法の杖 - Qiita
  • Gulp.js入門 - コーディングを10倍速くする環境を作る方法まとめ | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    普通に使う分には全く困らないほどの数のプラグインがGulpにはあります。 Githubでのstar数からも明らかなように、GoogleのWenStarterKitでもGulpが採用されるなど、注目度はますます高くなっています。 Gruntとの比較 Gruntと比較してのメリット・デメリットは以下のようになります。 メリット Gruntより設定ファイルが記述しやすい StreamAPIを利用することでファイルを毎回書き出すGruntより高速でエコ デメリット 記述がよりNodeに近くなるため、複雑なことは敷居がやや高め プラグイン開発のためのドキュメントが少ない 今日のゴール Gulp.jsを使ってコーディング作業を10倍速くする! そんな環境を作りたいと思います。 1. Node.jsをインストール まずはNode.jsをインストールしましょう。 Node.js http://nodejs

    Gulp.js入門 - コーディングを10倍速くする環境を作る方法まとめ | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • 1