Skip to content

Instantly share code, notes, and snippets.

@sunny4381
Last active February 2, 2021 04:17
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save sunny4381/5768c1fa2ec7f61208bf9ffe2674c0a9 to your computer and use it in GitHub Desktop.
Save sunny4381/5768c1fa2ec7f61208bf9ffe2674c0a9 to your computer and use it in GitHub Desktop.
How to build jquery-ui

How to build jquery-ui

Setup Environment

anyenv

jquery-ui のビルドには node と java が必要です。 node は nodenv を用いてインストールします。 java は brew でインストールするのですが容易にバージョン切り替えできるようにしておいた方が良いと思うので jenv もインストールして java のバージョンを切り替えられるようにします。

nodenv と jenv は anyenv を用いてインストールしますので、まず anyenv をインストールします。

$ brew install anyenv
$ anyenv init
$ vi ~/.zshrc 

次の行を追加

eval "$(anyenv init -)"
$ exec $SHELL -l
$ anyenv install --init
$ exec $SHELL -l

nodenv と node

ここでは 10.23.2 をインストールします。

$ anyenv install nodenv
$ exec $SHELL -l
$ nodenv install 10.23.2
$ nodenv global 10.23.2

jquery-ui の .travis.yml を確認すると 14 でもテストされているようなので、 14 をインストールしても良いかもしれません。

jenv と java

$ anyenv install jenv
$ exec $SHELL -l
$ jenv enable-plugin export
$ exec $SHELL -l

java は 8 をインストールします。

$ brew tap homebrew/cask-versions
$ brew install --cask adoptopenjdk8

インストールした java を有効にします。

$ jenv add $(/usr/libexec/java_home -v 1.8)
$ jenv global 1.8.0.282
$ jenv versions
$ java -version

Build

ソースコードをダウンロードし、テストを実行してみます。

$ git clone "https://github.com/jquery/jquery-ui.git"
$ cd jquery-ui
$ npm install
$ npm test

エラーがなければ、次のコマンドを実行してビルドします。

$ grunt sizer
$ grunt sizer_all
$ grunt jenkins

dist ディレクトリに生成物が作成されています。

Integrate into Shirasagi

$ cd jquery-ui
$ cp -p * ../shirasagi/vendor/assets/packages/jquery-ui/
$ cp -p dist/* ../shirasagi/vendor/assets/packages/jquery-ui/dist/
$ cp -p themes/base/images/* ../shirasagi/public/assets/jquery-ui/
$ cd ../shirasagi
$ git add vendor/assets/packages/jquery-ui public/assets/jquery-ui
$ git commit -m "update jquery-ui"

vendor/assets/packages/jquery-ui/dist/jquery-ui.cssapp/assets/stylesheets/ss/_jquery_ui.scss との内容を確認し、 画像のパスを適切に設定する。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment