browserifyでjqueryを読み込むときにだいぶ、苦労したのでメモしておきます。
詰まったポイント
browserify公式ページ
http://browserify.org/#install
1.テスト用のディレクトリを作る。
$ mkdir test
その中に移動して、
- package.json作成
$ npm init
下のindex.htmlを作成
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script src="./bundle.js"></script>
</body>
</html>
3.jquery をインストール
npm install jquery --save
4.テスト用スクリプトを書く（main.js）。
var $ = require('jquery');
$(function () {
alert("ok")
});
ここ↑で詰まりました。
詰まったポイント
1.jqueryの場合は、「$]にjqueryモジュールを代入しないと、
その後、jqueryとして使えない。
2.javascriptは、このmain.jsの中に書く。
勘違いして、index.htmlの中に書いていました。
5.browserifyをインストール
npm install browserify --save
6.browserify実行。(bundle.js作成)
./node_modules/.bin/browserify main.js -o bundle.js
※グローバールインストールしていないため、直接node_modulesの中に、
browserifyを呼びにいく。
7.下の一文をindex.htmlで読み込むと、jqueryが使えるようになる。
参考にさせて頂いた記事
npmとBrowserifyでjQueryを管理する（to-R様）
http://blog.webcreativepark.net/2015/12/24-221725.html