3
「jQueryが大きい」と言う問題ならばVoyeur.js (http://adriancooney.github.io/voyeur.js/) か Dojo http://dojotoolkit.org/ (DOMモジュールのみ).
jQuery以外のlibraryではなくて (新しいlibraryはだいたい新しい言語より学習が難しい…)、生のjsでやりたいことは:
var myDiv = document.getElementById('myDiv');
as = myDiv.querySelectorAll('ul li a');
for(var i = 0; i < as.length; i++)
as[i].style.display = 'none';
...
2
require は Node.js 特有の関数です。ブラウザには用意されていません。
require のようなモジュール機構を標準の仕様として策定する試みは進んでおり、import 文として形になっていますが、まだ各ブラウザでそのまま使える状態ではありません。
よって、モジュールとして提供されているコードをブラウザで使う方法も標準と言えるような物はなく、各々の好みや必要に応じてツールや作業手順を選ぶ事になります。
npm モジュールの Node.js での利用
Node.js では require が使えますので、質問のコード(main.js)はそのまま動きます。
npm コマンドが使える環境でしたら node もあると思いますので、以下のようにします。
node main.js
# 出力:
# { ...
2
サンプルコードありがとうございます!
サンプルコードを改造して色々試してみました。
結果、かなりトリッキーですが、browserifyの-rオプションを使わなくても
requireができるようになりました。
mod/aaa.coffee
bbb = require './bbb'
module.exports = class
constructor: (@name) ->
console.log 'aaa'
new bbb();
mod/bbb.coffee
module.exports = class
constructor: (@name) ->
console.log 'bbb'
mod/brequire....
2
-r オプションで外部にエクスポートしたいモジュールを指定します:
$ cat mymodule.js
module.exports = 'hi';
$ browserify -r ./mymodule.js:mymodule > application.js
$ cat application.js # ↓ 指定したモジュール
require=(function e(t,n,r){<...>{"mymodule":[function(require,module,exports){
module.exports = 'hi';
},{}]},{},[]);
<script src="application.js"></script&...
2
自分で使ったことはありませんが1.3kと小さく、高速だそうです https://github.com/KoryNunn/doc
とはいえこの程度の用途なら document.querySelectorAll() で済むかもしれませんね。昔のJSはクエリエンジンを自前で持っておらずjQueryが内包していたsizzleを経由していましたが、今のJSは標準でクエリエンジンを使うことができます。
追記: サーバーサイドでDOMスクレイピングする際、自分は cheeriojs/cheerio を使っています。
1
自己回答です。
bitcore-explorersをGitHubからinstallしたところ、問題なくrequireできました。
1
DOMtastic
Small, fast, and modular DOM & Event library for modern browsers.
Same familiar API as jQuery (but without the extra "weight" of modules like $.ajax, $.animate, and $.Deferred).
Weighs in at only 3 to 14KB (minified), depending on included modules. Full bundle is under 5KB gzipped.
npmにもありますし、jQueryから重たいAPIを除いたものといったかんじです。
Zepto
...
1
私も以前同様の問題にぶつかった経験があります。
サーバがページ表示のタイミングでしか生成できない変数があり、
それをJavascript関数に渡す必要があったのですが、色々試して結局断念した経験があります。
この部分さえ解決できればGulp+Browserifyが実用になりそうなのですが……
上位に投票された、最小文字数のコミュニティ wiki 以外の回答のみが対象となります