gulp と browserify と vinyl の話 - <body>
browserify の API が変わったので、この記事のコードのままでは動きません！ gulp で browserify しようとしたんだけど、 色々ハマったので、 ひとまずまとめておきたい。 登場人物 gulp ちゃん フロントエンドのビルドエンジン。 grunt を馬鹿にしてる。 browserify ちゃん CommonJS スタイルの require をフロントエンドでも使えるようにする npm モジュール。 調子に乗ってるけど webpack がきになる。 vinyl ちゃん npm 全般で使うオブジェクトの名前。モナドを感じる。 俺がさっき知った。 gulp の仕組み そもそも gulp って、確かに grunt より短く書けるけど、 具体的になにしてるのかよくわかんねーよ！ って思ったので、 まず、この短いコードから考えていきたい。 var gulp = require(
browserify for webpack users
Clone via HTTPS Clone with Git or checkout with SVN using the repository’s web address. browserify for webpack users There's been a strange explosion in misinformation about browserify recently, particularly in comparisons to webpack. Generally speaking, most of this confusion stems from how webpack is more willing to pull features into its core to ease discoverability while browserify is more lik
ES6 Modules, AMD and CommonJS
This article shares some techniques and tools for building web apps using future friendly ES6 module syntax. We begin with an exploration of current module formats and ways to work both forwards and backwards in time. The complete code for this article can be found here. For many years JS had a single widely accepted module format, which is to say, there was none. Everything was a global variable
gulp + browserify, the gulp-y way
Or How I Learned To Stop Worrying About gulp-browserify (and other gulp-* wrapper plugins) And Love Vanilla NodeJS Modules Updates as of 20 March 2016: The information in this article has been outdated for some time, and I have since moved away from Gulp to Webpack for bundling and packaging NodeJS source for browser. (I’m not knocking on Gulp here, it is still a great library. Just that I think W
browserify をはじめてみる
Browserify を触ってみたメモ。 Browserify とは CommonJS のモジュールの仕組み、つまり Node.js の require をブラウザ上でも使えるようにするもの、ということでいいみたい。Readme を読む限りは、npm にあるモジュールをブラウザ上にもっていくために作られ始めたような印象をうけるが、ちまたのエントリーをみていると AMD に代わりに CommonJS でフロントエンドの依存関係の管理をする (RequireJS ではなく、Node.js 感覚で require 関数をフロントエンドで使う) ためのツールとしても使っていいようだ。 やりたいこと 複数の js ファイルの依存関係を記述したい 最終的に、依存関係を考慮した順番で、ひとつの js ファイルに結合したい 作りたいのは第三者のサイトに埋め込んでもらうスクリプト (サードパーティスクリプト
testling-ciとtravis-ciでクライアントサイドもサーバサイドもテストを実行する - from scratch
まえがき NHK番組表APIのjavascript版を作りました。 NHKの番組表APIが発表されてて、皆思い思いに好きな言語で実装されていくのを見てました。 Golang : https://github.com/mattn/go-nhk Scala : https://github.com/seratch/nhk4s Perl : https://github.com/moznion/WWW-NHKProgram-API Python : https://github.com/drillbits/nhk-api Ruby : https://github.com/mitukiii/nhk_program-for-ruby Emacs : https://github.com/gongo/emacs-nhk-program Titanium : https://github.com/h5
BrowserifyからWebpackへの移行時の注意点 - Qiita
思い立ったが吉日ということで、プロジェクトのモジュール管理をRequire.jsからBrowserifyへと移行し、その直後にWebpackに移行しました。もうちょっと考えてツールを選ぼうと思います。 さて、Require.jsからBrowserifyへ変えた理由は、シンタックスをCommonJS的に書けるようになって、全体がシンプルになるから、という理由でしたが、BrowserifyからWebpackへの移行は、もうちょっと切ない理由での移行になりました。 Webpackとは ドキュメントも若干わかりづらいですが充実しており、基本的にここだけで必要な情報はほとんど得られます。 なのでこちらをどうぞ・・・じゃさすがにあれなので、ドキュメントに書いてある、作られた動機などを若干紹介します。 今はモジュールシステムがいろいろある CommonJS AMD <script> タグ ES6 Mod
A Gentle Browserify Walkthrough - Pony Foo
A relevant ad will be displayed here soon. These ads help pay for my hosting. Please consider disabling your ad blocker on Pony Foo. These ads help pay for my hosting. Building modules for the front-end has become an increasingly easy problem to solve. Back in the nineties we had our Java applets, our <MARQUEE> and <BLINK> tag combinations, and those beloved <CENTER> tags. Oh and we were mostly de
gulpでbrowserify使ってcoffee-scriptの監視とコンパイル - Qiita
まずnpmから必要な物をいれる。gulpで browserify/coffeeify を使ってビルドする場合、coffee-script も必要になる。 $ mkdir proj-path; cd proj-path $ npm init $ npm install --save-dev gulp gulp-browserify gulp-watch gulp-plumber gulp-rename coffeeify coffee-script gulp-rename リネームタスク gulp-watch 監視タスク gilp-plumber タスクの実行に失敗してもgulpを終了させないパイプ(watchでビルド失敗時に終了させない) gulp-browserify browserify gulpfile.coffee gulp = require 'gulp' browserify
Gulp + Browserify | Viget
Getting Started One weekend, I decided to really immerse myself in Grunt and RequireJS. Gotta stay up on these things right? Done. Then Monday rolls around, "and just like that Grunt and RequireJS are out, it’s all about Gulp and Browserify now." (╯°□°）╯︵ ┻━┻ When I was done flipping tables, I set aside my newly acquired Grunt + RequireJS skills, and started over again with Gulp and Browserify to
Getting Started with Browserify — SitePoint
JavaScript implementations have been getting more and more complex as the beautiful beast we call the web evolves each year. Many of us now work with JavaScript modules – independently functioning components that come together to work as a cohesive whole, yet can happily have any component replaced without causing armageddon. Many of us have been using the AMD module pattern and RequireJS to accom
Browserify: それはrequire()を使うための魔法の杖 - Qiita
JavaScript界のハリーポッターこと「Browserify」が最近元気ですね。Node.js的な var myModule = require('myModule')式の記述が、ブラウザのスクリプトでも使えるようになって、ついでに1ファイルにまとめるのもやってくれるツールです。ポストRequireJSとして期待されています。 ただ、公式ドキュメントがコマンドラインの説明に重点を置いていて、最初これだけだといまいち分かりにくい...。そこで、実際の開発で使いやすいように、ビルドツール(gulp.js)から実行するための最小構成を作ってみようかと思います。(Gruntでも同様のことは可能です) require!: Bowerも使えます 対象のスクリプトの中身は、例えばこんな感じ。この例では、ModernizrとjQueryと、独自スクリプトを組み込んでいます。外部ファイルを指定するだけで
Browserifyの使い方について調べてみた - yutaponのブログ
最近Browserifyって単語を良く見るようになりました。 Browserifyをざっくり説明すると、 ブラウザ上でもNode.js用モジュールを使えるようにする ブラウザでもrequire()を使ったモジュール管理を使えるようにする という特徴があるようです。 browser（ブラウザ）+ fy（〜する）という単語からもNode.jsをブラウザ化するってニュアンスでしょうか。 require()といえばRequireJSも提供してますよね。 Browserify使うことでRequireJSを使わなくてもモジュール管理ができるようになりそうです。 Browserifyの使い方 まずは公式サイトに載ってるコードを試してみます。 browserify これはどうやらNode.js向けのモジュールをブラウザでも使えるようにするチュートリアルのようです。 まず作業ディレクトリを作成します。 $
browserifyを試してみる - Qiita
既にアドベントカレンダーの投稿予定の日は過ぎ去っていますが、、書きました。 最近までbrowserifyに関して、substackが作った何か、ぐらいのことしか知りませんでした。 今回、クライアントサイドでJavaScriptのモジュール管理が可能にできるツールだと人から教わり、実際に試してみました。 (nodeのコアライブラリが利用できる点などは特に触れません。) browserifyとは何か browserifyとは、クライアントサイドのJavaScriptでモジュールシステムを実現するnpmです。 公式サイトには、 require('modules') in the browser とあります。 具体的には、 という形でモジュールの読み込みが出来るようになります。 (モジュールシステムを提供する点ではRequire.jsと似ているようで、実際はだいぶ違うように思います。) 単純にこれ
browserify を使い始めるためのファーストステップ 2013 冬
browserify は、ブラウザ JavaScript のためのコードを、Node スタイルのコード（Node 向けの JavaScript コードを書いているかのような形）で記述しておいて、ブラウザ上で利用できるような Javascript コードとして出力してくれるツール。 require() で利用しているモジュール群をすべてアナライズして、それらモジュールコードまですべて都合よい形で同梱してくれる。 リリース当初（３年くらい前）は Node で HTTP サーバを建ててブラウザ用 Javascript コードを返すような仕掛けから始まったはずで、そこから静的ファイルを出力する仕組みが追加されて、現在ではむしろ後者の方がメイン扱いになっている感じになっている。 そうなった背景として、Grunt の登場でその辺りの機能が有効的に参照利用できるようになったり、実際に Grunt を使っ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - studiomohawk/browserify-handbook: how to build modular applications with browserify
Tale of npm, css and html
GitHub - browserify/browserify-handbook: how to build modular applications with browserify
Introduce browserify
browserifyことはじめ
