Rewish

ウェブデザイン、HTML、CSS、JavaScript、PHP、WordPress、Movable Typeなど、Web制作で役立つかも知れないBlog.

Search

Entry Search

jQueryの開発コードをビルドして使う (Win & Mac)

カテゴリー
JavaScript
タグ
Git, jQuery

jQueryの開発リポジトリに入っているファイルは、開発用のためモジュール毎に分割されています。

コードを追う時は良いですが、開発中のjQueryが使いたい！と言う時に、これらを全て読み込むのはちょっと面倒なので、ビルドして一つのファイルにしてみたいと思います。

今回は、Windowsの場合とMacの場合二つの方法を紹介します。

Windowsの場合

Windows XP SP3へのインストールを想定しています。その他の環境では動作しない可能性があります。

Gitをインストール

msysgit - Project Hosting on Google Codeからインストーラーをダウンロード。

※今回はGit-1.6.5.1-preview20091022.exeを選択

インストールの手順は以下の通り。

  1. Welcome to the Git Setup Wizard
    Welcome to the Git Setup Wizardのキャプチャ
    1. Next >
  2. Information
    Informationのキャプチャ
    1. Next >
  3. Select Destination Location
    Select Destination Locationのキャプチャ
    1. Next >
  4. Select Start Menu Folder
    Select Start Menu Folderのキャプチャ
    1. Next >
  5. Select Additional Tasks
    Select Additional Tasksのキャプチャ
    1. Next >
  6. Adjusting your PATH environment
    Adjusting your PATH environmentのキャプチャ
    1. Run Git and included Unix tools the Windows Command Promptを選択
    2. Next >
  7. Choosing CR/LF behavior
    Choosing CR/LF behaviorのキャプチャ
    1. Use Unix style line endingsを選択
    2. Next >

jQueryをチェックアウト

  1. 適当な場所にフォルダを作る (今回はD:\jquery-devを作成)
  2. 作成したフォルダを右クリック
  3. Git Bash Hereをクリック
  4. Bashが立ち上がるので、以下のコマンドを実行する
git clone git://github.com/jquery/jquery.git .

※コピーして貼り付け: タイトルバーを右クリック(またはAlt+Space) -> 編集 -> 貼り付け

以上でD:\jquery-devにjQueryの開発コードがコピーされる。

Apache Antをインストール

Apache Ant - Binary DistributionsからApache Antのバイナリをダウンロード。

※今回はapache-ant-1.7.1-bin.zipを選択

  1. zipアーカイブを解凍
  2. 出来たフォルダ(apache-ant-1.7.1)をantにリネーム
  3. antフォルダをCドライブ直下へ移動

C:\ant\binのようなファイル構成になっていればOK。

ビルド用のバッチファイルを作成

D:\jquery-dev\build.batを以下の内容で作成。

@echo off

set /p arg="オプションを指定しますか？[空エンター可]: "
C:\ant\bin\ant %arg%

いよいよビルド！

上記で作成したbuild.batを実行してエンターを押せば、D:\jquery-dev\dist内にjquery.jsが作成される。

minified版を作りたい場合は、「オプションを指定しますか？」に「min」と答えて下さい。

最新版を使いたい場合

  1. 開発コードが入っているフォルダ(D:\jquery-dev)を右クリック
  2. Git Bash Hereをクリック
  3. Bashが立ち上がるので、以下のコマンドを実行する
git pull --rebase

開発コードに更新があれば、新しい開発コードがコピーされるので、いよいよビルド！の手順で再度ビルドを行う。

Macの場合

Mac Book Pro (Mac OSX Snow Leopard)へのインストールを想定しています。その他の環境では動作しない可能性があります

Gitをインストール

  1. git-osx-installer - Project Hosting on Google Codeからdmgをダウンロード
    今回はgit-1.6.5.5-intel-leopard.dmgを選択
  2. git-1.6.5.5-intel-leopard.dmgをダブルクリックしてマウント
  3. デスクトップのGit 1.6.5.5 Intel Leopardを開く
  4. git-1.6.5.5-intel-leopard.pkgを実行し、ウィザードに従いインストール

jQueryをチェックアウト

ターミナルを起動し、以下のコマンドを実行する。

git clone git://github.com/jquery/jquery.git $HOME/jquery-dev

上記のコマンドで、ユーザーのホームディレクトリ /Users/ユーザー名/jQuery-dev にjQueryの開発コードがコピーされる。

ビルド！

ターミナルを起動し、以下のコマンドを一行ずつ実行する。

cd $HOME/jQuery-dev/
make

/Users/ユーザー名/jQuery-dev/dist内にjquery.js及びjquery.min.jsが作成される。

最新版を使いたい場合

ターミナルを起動し、以下のコマンドを一行ずつ実行する。

cd $HOME/jQuery-dev/
git pull --rebase
make