tanaka's Programming Memo

プログラミングについてのメモ。

gulp

Gulp+React+Babel(babelify)+watchify+BrowserSyncを使ったビルド設定

Reactの復習と、記憶を呼び戻すための自分用のメモです。uglifyやらmapファイルの作成もしてないごく簡単な動作確認用のものです。 利用するもの Gulp ビルドやデプロイなどを行うツール React クライアントサイドのビューを担当するエンジン Babel 策定中の…

gulp+watchify+browserify+babel+reactでビルドが速くならない

watchifyでビルドの高速化を図ろうとしたところ、ビルドするたびに遅くなってしまいました。原因は、Browserifyのオプションを指定していないことでした。以下、オプションとWatchifyとBrowserifyの部分の抜粋です。propsが必要でした。 var jsSrcPath = "./…

gulpのsrcでのファイル指定

コピーやFTPのアップロード時に複数ファイルを選択する方法を調べていました。gulpのsrcはglob形式で指定できます。 Globの書式 globの公式の情報は以下。 isaacs/node-glob · GitHub 上記を斜め訳。 Globの概要 Globは ls *.js をコマンドラインで指定した…

GulpとBrowserSyncでreloadが動作しない

gulpで監視タスクを開始して、監視対象のファイルを変更すると、ログでは「Reloading Browsers...」と表示されるのですが、ブラウザは更新されないという症状が発生していました。原因として見つけたのは以下のもの。 bodyタグがないと動かない linkの指定が…

mac OS X10.10 で gulp watchify が動かない

突然、gulp の watch タスクが動かなくなりました。原因は、該当フォルダーのSpotlightの設定が壊れていたことでした。 チェック方法 同様の症状かを確認するには、以下を行います。 Finderで、監視するJavaScriptなどが入っているフォルダーを開く ターミナ…

generator-react-gulp-browserifyに含まれているgulpfile.jsを読む

gulpの動作を勉強するために、やりたい処理を実現しているyeomanのrandylien/generator-react-gulp-browserify · GitHubに含まれているgulpfile.jsの中身を読んでみました。 'use strict'; strictモードにして、JavaScriptの動作を厳格にします。 var gulp =…