タスクランナーの連続実行を抑止する: gulp.js, Grunt - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
Concatだけでビルドを済ませてた例（Backbone.jsとAngularJS）
Concatでどこまで戦えるのか @jxck_ browserify使ってるんだけどあんま意味ない感じになっててつらいんだよねーっていうのを昨日 @ahomu に話したら、concatで全然いけますよって言われたからさっき乗り換えた。 — Kazuhito Hokamura (@hokaccha) August 6, 2014 (＾ω＾) 全然いけますよ 依存管理をサボってconcat 以下、「依存管理に労力を割きたくない」という理由で依存管理を省略した場合に、concatだけで破綻無くビルドするためにやっていたパターンの紹介。いけますと言った手前はあるが、最終的には現場によってケースバイケースということで、どうかひとつご容赦願いたい。 Case 1: Backbone.js Backbone.jsの場合、extends に代表されるクラスベースのオブジェクト指向モデルに多少の制約が必要に
BrowserSync - pirosikick's diary
BrowserSync livereloadよりbrowser-syncの方がいいよと聞いたので使ってみた。 使い方 npmでインストール $ npm install -g browser-sync 手元のディレクトリにhtmlとcssがあり、html, cssが更新した時にhtmlをリロードしたい場合、 $ browser-sync start --server --files "*.html, css/*css" で、ポート3000番で起動しブラウザ開く。地味に嬉しかったのは3000番が既に使用済みの場合は3001番で起動する（確認してないが多分その後もカウントアップしていき空いてるポート番号で起動するはず） プロキシも--proxyオプションでプロキシしたいホスト名指定するだけなのですごい楽 $ browser-sync start --proxy "プロキシしたいホスト名" --f
『RequireJS等はもう古い。WebPackとは？』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 はじめまして。 アメーバ事業本部 クロスイノベーション室のグンタ（@gunta85）と申します。 今回はフロントエンド開発用の、 ありとあらゆる依存関係を簡単に解決してくれる、 WebPackというスグレモノをご紹介します。 導入経緯大きなアプリを開発するにあたり、依存関係を解決してくれるものを探していました。 その中で、RequireJSやBrowserify、Componentなども候補に挙がりましたが、 諸々の理由でWebPackを選びました。 特徴の違いについては「WebPack vs Browserify」等で検索してみると良いかと思います
gulp vs Grunt - lxyuma BLOG
概要 gulpの入門記事を以下に書いて行きます。 目次 gulpとは gulp sample gulp支える技術(Streamと並行性) grunt vs gulp どっち使う? gulp.jsとは いわゆるフロントエンド周りの task runner build tool Gruntあるでしょ その通り いわば、Gruntの簡易版 去年位?出来た後発のtool 最近、blog記事も増えてきた 公式Page売り文句 複雑なtaskも管理し易く、simpleで、使うのが簡単 一時fileのdisk書き込みが無いので早くて能率的 simpleで期待通り動くようにPluginのGuidelineがある APIが小さく学習時間かからない リソース gulp公式page 入門記事 クラスメソッドさんの入門記事 shuheiさんのqiita記事 sample多め anatooさんの入門記事 Shump
gulpでJavaScriptの結合圧縮処理
gulpでJavaScriptの結合圧縮処理 gulpでJavaScriptの圧縮処理を設定してみました。ご想像の通りuglifyJSですが@readymadegogoに教えてもらったuseminというプラグインも合わせて利用します。 gulpの使い方は「タスクランナーgulp入門」を参照してください。 まずは圧縮用のgulp-uglifyとgulp-useminをインストール。 sudo npm install gulp-uglify gulp-usemin --save-dev 今回の設定の肝はgulp-usemin。これを利用するとHTML上に直接圧縮処理の設定を記述できます。 たとえばHTMLを以下のように設定した場合、useminを実行したらscript1.jsとscript2.jsを圧縮結合したscript.min.jsというファイルを生成しHTML上のscriptの呼び出しを
Navigation Timingだからできる、Webアプリを俯瞰したパフォーマンス計測(1/3)
Navigation Timingだからできる、Webアプリを俯瞰したパフォーマンス計測(1/3) 川田寛（ピクシブ株式会社） こんにちは、html5jパフォーマンス部、スタッフの川田です。5月8日ですが、私たちのコミュニティ主催で勉強会を開催することになりました！！ そして、残念なお知らせです。募集した直後に、席が埋まってしまいました！せっかく、これだけ多くの方にパフォーマンスへ興味を持っていただいたのに、このままじゃもったいない！ なので本記事では、この勉強会で語られない、別の切り口からパフォーマンスについて語ってみようかと思います。内容は、私が技術評論社「Software Design 2014年5〜7月号」にて連載しております、「Web標準技術で行う、Webアプリのパフォーマンス改善」で扱っているテーマの一部を、Web向けに書き直したものです。 Webアプリのパフォーマンス計測は簡
Chrome Socket APIを古くから使っている人に新しいAPIのススメ
Chrome Webブラウザは、Web標準技術を使って、OS Nativeなアプリと遜色がないGUIアプリケーション（Chrome apps、昔Packaged appsと呼んでたもの）を実行する環境が搭載されています。OS Nativeなアプリに負けないためには、「できること」が多くなければなりません。すなわち、APIが充実していればしているほど、きっとOS Nativeなアプリとの競争力も強くなっていくことでしょう。 そのAPI群の中に、ソケットを扱うためのAPIがあります。Packaged appsが作れるようになったかなり初期の頃からSocket APIは提供されていました。具体的には、Chrome 24からあります。そのSocket APIの名前空間は、”chrome.socket”です。このSocket APIにより、TCPやUDPのクライアントコードを書くことはもちろん、サー
Docco
Docco is a quick-and-dirty documentation generator, written in Literate CoffeeScript. It produces an HTML document that displays your comments intermingled with your code. All prose is passed through Markdown, and code is passed through Highlight.js syntax highlighting. This page is the result of running Docco against its own source file. Install Docco with npm: sudo npm install -g docco Run it ag
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - schickling/gulp-webserver: Streaming gulp plugin to run a local webserver with LiveReload
GitHub - carbonfive/mocha-server
GitHub - mrhooray/gulp-mocha-phantomjs: run client-side Mocha tests with PhantomJS
Framer: Create a professional website, free. No code website builder loved by designers.
Chrome Developer Toolsを使いこなそう！
GitHub - nprapps/pym.js: Resize an iframe responsively depending on the height of its content and the width of its container.
GitHub - frostney/grunt-codo: Grunt task for generating codo documentation
GitHub - DavidSouther/grunt-docco: Docco task for Grunt.
GitHub - jmreidy/grunt-browserify: Grunt task for node-browserify
adunkman/connect-assets · GitHub
GitHub - jdcataldo/grunt-mocha-phantomjs: A simple grunt wrapper for mocha-phantomjs to allow for ci integration
