node_modules/foo/index.js はES6 moduleで書いて、babelでコンパイルして返したいようなケース。 node_modules/foo/index.js でbrowserify: {transform: ...} しておけば使ってくれる。
JSX + TypeScript の悪魔合体 ギョーム的に気持ちになったので JSX + TypeScript をはじめました。 導入にあたってチーム内への説明を兼ねたブログ。AltJSに対して ES でいいじゃん派ですが、自分の型需要に対して 現状の Flowtype が辛みしかないのでやむをえず。 動機 紆余曲折あって結局 React を使うことにした React Component には JSX with Babel を使いたい(手書きは無理だ) UI 以外のロジックを持ったモジュールは型の恩恵に預かりたい Flowtype つらい TypeScript かー UI 周りは JSX で、その他の堅いロジックは TypeScript で書けばいいのでは? 共存だ!! メリットがあるのかも不明瞭ですが、分からないからこそ試してみようという感じです。JSX と TypeScript の境界
概要 ビルドツール : gulp altJS : TypeScript モジュール管理: Browserify 以下で説明していく開発環境のひな形はGitHubに置いてありますm(_ _)m https://github.com/massa142/typescript-devenv 前提 Node.jsインストール済み。 Node.jsのインストール方法に関しては、以下の記事が詳しいのでご参照ください。 node.jsのversionを管理するためにnodebrewを利用する - Qiita 参考にしたもの TypeScriptリファレンス Ver.1.0対応 gulpでbrowserifyを使う | 4uing Usage npm install gulp tsd gulp (tsc| browserify | watch| minify) ファイル構成 root ├── src
I'm someone who has never doubted that will become a programmer one day. I wrote my first function (random number generator for a lottery taken from a book) when I was eleven years old, but professionally I'm in this field for 10+ years. Even though I always knew that I would be a programmer, it was never an easy thing trying to stay on top and be the best developer I could be. Luckily that's what
Browserify を触ってみたメモ。 Browserify とは CommonJS のモジュールの仕組み、つまり Node.js の require をブラウザ上でも使えるようにするもの、ということでいいみたい。Readme を読む限りは、npm にあるモジュールをブラウザ上にもっていくために作られ始めたような印象をうけるが、ちまたのエントリーをみていると AMD に代わりに CommonJS でフロントエンドの依存関係の管理をする (RequireJS ではなく、Node.js 感覚で require 関数をフロントエンドで使う) ためのツールとしても使っていいようだ。 やりたいこと 複数の js ファイルの依存関係を記述したい 最終的に、依存関係を考慮した順番で、ひとつの js ファイルに結合したい 作りたいのは第三者のサイトに埋め込んでもらうスクリプト (サードパーティスクリプト
思い立ったが吉日ということで、プロジェクトのモジュール管理をRequire.jsからBrowserifyへと移行し、その直後にWebpackに移行しました。もうちょっと考えてツールを選ぼうと思います。 さて、Require.jsからBrowserifyへ変えた理由は、シンタックスをCommonJS的に書けるようになって、全体がシンプルになるから、という理由でしたが、BrowserifyからWebpackへの移行は、もうちょっと切ない理由での移行になりました。 Webpackとは ドキュメントも若干わかりづらいですが充実しており、基本的にここだけで必要な情報はほとんど得られます。 なのでこちらをどうぞ・・・じゃさすがにあれなので、ドキュメントに書いてある、作られた動機などを若干紹介します。 今はモジュールシステムがいろいろある CommonJS AMD <script> タグ ES6 Mod
This talk covers build tooling, processes, and your development workflow. You’ll get a glimpse as to why you should be building, and why you should put together a build process from the get-go. Then we’ll move on to tooling. Here I’ll discuss some of the most popular JavaScript build tools, namely Grunt, Gulp, and npm. We’ll investigate how each one performs for certain tasks, and I’ll help you fo
最近Browserifyって単語を良く見るようになりました。 Browserifyをざっくり説明すると、 ブラウザ上でもNode.js用モジュールを使えるようにする ブラウザでもrequire()を使ったモジュール管理を使えるようにする という特徴があるようです。 browser(ブラウザ)+ fy(〜する)という単語からもNode.jsをブラウザ化するってニュアンスでしょうか。 require()といえばRequireJSも提供してますよね。 Browserify使うことでRequireJSを使わなくてもモジュール管理ができるようになりそうです。 Browserifyの使い方 まずは公式サイトに載ってるコードを試してみます。 browserify これはどうやらNode.js向けのモジュールをブラウザでも使えるようにするチュートリアルのようです。 まず作業ディレクトリを作成します。 $
既にアドベントカレンダーの投稿予定の日は過ぎ去っていますが、、書きました。 最近までbrowserifyに関して、substackが作った何か、ぐらいのことしか知りませんでした。 今回、クライアントサイドでJavaScriptのモジュール管理が可能にできるツールだと人から教わり、実際に試してみました。 (nodeのコアライブラリが利用できる点などは特に触れません。) browserifyとは何か browserifyとは、クライアントサイドのJavaScriptでモジュールシステムを実現するnpmです。 公式サイトには、 require('modules') in the browser とあります。 具体的には、 という形でモジュールの読み込みが出来るようになります。 (モジュールシステムを提供する点ではRequire.jsと似ているようで、実際はだいぶ違うように思います。) 単純にこれ
はじめに browserifyは、CommonJSスタイルで書かれたJavaScript (Node.js)のコードをクライアントで実行可能な形式に変換するライブラリです。ここではbrowserifyがビルドの際に用いているbrowser-packが、与えられたコードをどんなコードを出力するのかを見ていきます。browser-packのバージョンは6.0.1。 入力 Readmeにある以下のjsonを試してみる。この形式はちょうどmodule-depsの出力結果と同じもので、browserifyも内部でmodule-depsを利用している。内容は 各モジュールを一意に指すID コードの本体 各モジュールが依存する(内部でrequire()を使って呼び出している)モジュールのパスとID そのモジュールがエントリポイントかどうか の4種類。 [ { "id": "a1b5af78", "sou
browserify http://browserify.org/ browserifyはbrowser環境でもnodeのようにrequire('xxx')というスタイルで依存しているライブラリを読み込むことが出来るようになるもので、最近盛り上がってますね。 (Backboneなど色々なプロジェクトでbrowserifyについて議論されていたり) ここでは基本的な使い方は省略して、Backbone + Marionetteなサンプルプロジェクトをbrowserify対応してみたのでその構成についてを書きたいと思います。 (まだ全然理解出来てないので、もっといい方法があれば教えて欲しいです) Sample Project https://github.com/koba04/backbone-boilerplate http://koba04.com/last-fm-top-tracks/ サ
YoutubeとVimeoの検索結果のRSSをまとめてOPMLで取得できるサイトを作った | Web scratch で公開した Tech Video RSS Searcher はbrowserifyを使って作ったので、その辺の開発フローについての記事です。 browserify って何? browserify はNode.jsスタイルで書かれたモジュール(CommonJS)を ブラウザで利用できるように変換するコマンドラインツール(Nodeモジュール)となっています。 又、node.jsのCore Modulesのshimが用意されていて、 npmで公開されているnode.js向けのモジュールも一緒に変換してブラウザで動かすことが出来るようになっています。(普通に require で読みこめば勝手に変換されます) 原理的に無理だったり全てのモジュールが動くわけじゃないですが、 その辺の互
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く