タグ

2016年11月6日のブックマーク (3件)

  • Browserify + gulp-uglify で JS ファイルを連結 & minify - Gulp で作る Web フロントエンド開発環境 #3 | Recruit Tech Blog

    Ruby on Railsや Middleman における開発では、 sprockets によって複数ある JS ファイルを一つに連結して依存関係を解決するのが一般的かと思います。今回は Gulp での開発環境を作るということで、それ以外の方法で依存関係を解決することになります。そんな訳で、Gulp で依存関係を実現するモジュールである Browserify を試してみるとします。 Browserify サンプルコードはこちらからどうぞ。 wakamsha/try_gulp そもそも依存関係って何? Browserify とはJSファイル間の依存関係を管理することが出来るライブラリです。 なんて解説をよく見かけますが、日語力の低い僕は依存関係なんて単語をいきなり出されてもよくわからないので、もっと身近な具体例を挙げて理解を深めるとします。 例えば jQuery を使った JavaScri

    Browserify + gulp-uglify で JS ファイルを連結 & minify - Gulp で作る Web フロントエンド開発環境 #3 | Recruit Tech Blog
  • JSをbrowserifyでビルドし、ライセンスコメントを適切に残す - $shibayu36->blog;

    最近JSを利用するときは、依存モジュールはnpmを利用し、ES6やTypeScriptの仕様を開発には使った上で、ブラウザ用にコンパイルして配信するようになってきている。また同時にネットワークの負荷を下げるためにminifyを行う場合もある。 minifyはライセンスが絡むと少し難しい。例えばコメントを全て削除してしまうとライセンスコメントまで消えてしまう。この問題にはみんながそれぞれの手法で対処しているみたい。1年ほど前の記事でクライアントサイドJavaScriptのライセンス管理 | エンジニアブログ | GREE Engineering というものがあり、いろんなJSのコンパイルのためのライブラリが独自でライセンスの形式を決めていて、それにマッチしないものは消えてしまう、みたいな辛いことが起きてそうだった。 そこで今回は自分の勉強も兼ねて、npmのモジュールを含めてブラウザ用にコンパ

    JSをbrowserifyでビルドし、ライセンスコメントを適切に残す - $shibayu36->blog;
  • gulpの基本的な使い方(gulp.jsの基礎をしっかり理解する) | mae's blog

    ここのところのgulpの勢いに負けて、自分もついにGruntからgulpに移行しました。gulpはGruntと同様フロントエンド開発用のタスクランナーです。最初はGruntとそれほど変わらないだろうと思っていましたが、タスクを書いてみるとその違いがすぐにわかりました。シンプルに書けるだけでもgulpはかなり良いです。今回、自分の理解を深めるついでに基的なタスクの書き方をまとめてみました。 gulpの特徴まずgulpの特徴を簡単に書いていきます。 ストリーム: gulpは、「the streaming build system」と言われているようにNode.jsのストリーム(ファイルのパスとファイルの中身の情報を持ったオブジェクト)を使って処理を行っていきます。そのため中間ファイルを生成することなくタスクが実行されていくため高速に処理がなされます。並列処理: さらにgulpは、処理が一つ一

    gulpの基本的な使い方(gulp.jsの基礎をしっかり理解する) | mae's blog