Node.js環境のherokuでjspmを動かす

Aurelia.jsのテスト実装をherokuで試している時に、バンドルされたファイルではなくてバンドル前のファイルをサーバ上で動かしてみたいと思い、jspmをherokuで実行してみようと試みました。 結構はまりどころ […]

Aurelia.jsのテスト実装をherokuで試している時に、バンドルされたファイルではなくてバンドル前のファイルをサーバ上で動かしてみたいと思い、jspmherokuで実行してみようと試みました。
結構はまりどころがあったのでまとめてみたいと思います。
後々jspmのversionが7になったら改善されるらしいです。

今回はherokuでScriptを実行する方法とあわせて、大量のjspm関連ファイルをgitからインストールする際に起こるエラーへの対処方を紹介したいと思います。

herokuのアプリケーションを作成するときに

herokuのアプリケーションを作成する際にheroku側で動くbuildpackを指定できるのですが、今回はjspmが動くようになるビルドパックを選択してみました。
(必ずしも必要かわかりません。package.jsondependenciesjspmがあれば良いだけかも)
heroku内でjspmやgulpやsassのビルドができるものがあったので入れてみます。

ビルドパックをアプリケーションを作る時に入れる場合

heroku create myappname --buildpack https://github.com/TimPetricola/heroku-buildpack-nodejs-jspm-gulp-sass.git

既存のアプリケーションにビルドパックを入れる

heroku buildpacks:set https://github.com/TimPetricola/heroku-buildpack-nodejs-jspm-gulp-sass.git -a myappname

jspmだけでいいという方は下記の方がいいかもしれません

heroku create myappname --buildpack https://github.com/kudos/heroku-buildpack-nodejs-jspm.git

herokuでビルドできるようにpackage.jsonを設定する

heroku側の設定はpackage.jsonを設定することで可能です。

npm install後のアクション指定

package.jsonscriptsの項目にpostinstallを追加してあげます。今回はjspm install -ypush時に実行しています。

  "scripts": {
    "start": "node app.js",
    "test": "gulp test",
    "e2e": "gulp serve webdriver-standalone e2e",
    "postinstall": "jspm install -y"
  }

Buildで走るエンジンの指定

enginesの項目でBuild時に実行されるエンジンのバージョンを指定できます。
自分の環境にあわせて設定します。

  "engines": {
    "node": "0.12.x",
    "npm": "3.5.x",
    "jspm": "0.16.x"
  }

jspmのgithub configを設定する

認証していないとき容量が多いと動かなくなる場合があります。
下記のようなエラーが表示されます。

GitHub rate limit reached. To increase the limit use GitHub authentication.
Run jspm endpoint config github to set this up.

このエラーがでた場合の修正手順を説明します。
⇒参考https://gist.github.com/topheman/25241e48a1b4f91ec6d4

1.githubにログインしてトークンをつくる

https://github.com/settings/tokens

Personal settings > Personal access tokens

上記ページで自分のトークンを作る。

2.JSPM_GITHUB_AUTH_TOKENを調べる

herokujspmconfigに設定するためにJSPM_GITHUB_AUTH_TOKENを調べます。

下記実行しユーザ名とトークンを入力

jspm registry config github

下記実行すると出力されます

jspm registry export github

出力

jspm config registries.github.remote https://github.jspm.io
jspm config registries.github.auth JSPM_GITHUB_AUTH_TOKEN
jspm config registries.github.maxRepoSize 100
jspm config registries.github.handler jspm-github

3.herokuのconfigに登録

まずはherokuへログインします。

heroku login
jspm config registries.github.auth JSPM_GITHUB_AUTH_TOKEN

上記のJSPM_GITHUB_AUTH_TOKEN部分に表示されている値をherokuconfigに登録します。

heroku config:set JSPM_GITHUB_AUTH_TOKEN=exportで吐き出されたTOKEN

4.herokuへコミット!

先ほど作成したpackage.jsonherokuへコミットします。git.ignorefile等修正し、実行に必要なファイルを一緒にコミットします。
jspm関連ファイルもheroku側で追加されるためjspm_packagesフォルダ等は含まなくても良くなります。

jspmのversionが上がると上記容量の問題も起こらなくなるそうです。
早く手間が省けるといいなと思います。