Rails5.1.0 で React を導入するときに詰まったNode.jsエラー: Node.js not installed.

環境

  • Ubuntu16.04
  • Ruby2.4.1
  • Rails5.1.0

rails new したあとに rails webpacker:install:react すればよいと聞いていたのでやってみるがエラーが出た

$ bundle exec rails webpacker:install:react
Node.js not installed. Please download and install Node.js https://nodejs.org/en/download/

Node.jsはapt-get install nodejs で入れていたつもり

$ nodejs -v
v4.2.6

もしかしたら node ではなく nodejs にコマンド名がなっているせいかと思い nodejs-legacy をインストール

$ sudo apt-get install nodejs-legacy
$ bundle exec rails webpacker:install:react
Webpacker requires Node.js >= v6.4 and you are using v4.2.6
Please upgrade Node.js https://nodejs.org/en/download/

エラーがversionエラーになった。

nodejsを最新版に上げてみる

$ sudo apt-get install npm
$ sudo npm install -g n
$ sudo n stable
$ sudo ln -sf /usr/local/n/versions/node/7.10.0/bin/node /usr/bin/node
$ node -v
v7.10.0
$ bundle exec rails webpacker:install:react
Webpacker requires yarn. Please download and install Yarn https://yarnpkg.com/lang/en/docs/install/

yarnがいるよと言われた。

$ sudo npm install -g yarnpkg
$ yarn -v
yarn install v0.15.1
$ bundle exec rails webpacker:install:react
Configuration config/webpack/paths.yml file not found.
Make sure webpacker:install is run successfully before running dependent tasks

rails webpacker:install が必要っぽい

$ bundle exec rails webpacker:install
Webpacker is installed �
sing /home/ubuntu/rails/config/webpack/paths.yml file for setting up webpack paths
Copying react preset to your .babelrc file
Copying react loader to /home/ubuntu/rails/config/webpack/loaders
create  config/webpack/loaders/react.js
Copying react example entry file to /home/ubuntu/rails/app/javascript/packs
create  app/javascript/packs/hello_react.jsx
Installing all react dependencies
run  ./bin/yarn add react react-dom babel-preset-react prop-types from "."
Yarn executable was not detected in the system.
Download Yarn at https://yarnpkg.com/en/docs/install
Webpacker now supports react.js �

yarnがない?npmじゃなくてパッケージで入れてみる

$ curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
$ echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
$ sudo apt-get update && sudo apt-get install yarn
$ bundle exec rails webpacker:install:react
Done in 5.22s.

できたっぽい。

追記

yarnはパッケージじゃないとだめっぽいので以下を再実行したほうがよさそうです。

$ bundle exec rails webpacker:install
$ bundle exec rails webpacker:install:react

Cordovaエラー No image found at the path referenced under key “CFBundleIconFile”: Icon.png

Cordovaのエラーではないけど、VisualStudio2015のCorodvaアプリをiOS releaseでビルドして審査に出そうとすると、タイトルのエラーが出て提出できない。

ipaファイルを展開してみると、たしかにrootにicon.pngがない。config.xmlとかいろいろicon.pngを置く場所とかいろいろ試してみたけど、どうしてもrootにicon.pngがコピーされない。

とりあえずの対処法として、ipaファイルを一度展開して、icon.pngをおいて、再度パッケージ化することにした。

## Mac上で
# VSからリモートビルドしたipaを用意、展開
unzip HOGE.ipa
# 署名削除
rm -rf Payload/HOGE.app/_CodeSignature
# icon.pngをrootに設置
cp icon.png ./Payload/HOGE.app/
# 署名
codesign -f -s "MySIGN" ./Payload/HOGE.app --entitlements ../entitlements.plist
# パッケージ化
zip -qr HOGE.ipa Payload

entitlements.plistは

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>application-identifier</key>
<string>PREFIX.ID</string>
<key>com.apple.developer.team-identifier</key>
<string>TEAMID</string>
<key>get-task-allow</key>
<false/>
<key>keychain-access-groups</key>
<array>
<string>PREFIX.ID</string>
</array>
</dict>
</plist>

参考サイト

[Appium] Ad-hoc用のipaファイルを開発者用の署名に差し替えてAppiumで使用できるようにする – Qiita

ipaファイルのProvisioningを差し替える – Qiita

Cordovaアプリを実機Androidでデバッグ開始時に最初に出るエラー

Androidデバッグを開始しようとしたときに、以下のメッセージが出る場合、接続されているAndroidWindowsに登録する必要がある。

Android デバイスに展開できません。接続されているデバイスが見つかりませんでした。デバイスを接続したばかりであれば、認識されるまで数秒かかる場合があります。

以下のサイトがとても参考になる。

Google USB DriverでAndroid端末をWindowsに認識させる – Yahoo!知恵袋

Visual Studio 2015で開発したCordovaアプリを iPhone/iPod touch で起動する

環境

機器 状況
Windows7 Visual Studio 2015でCordovaアプリを開発
Mac ローカルネットワーク上に存在
iPod touch Macに接続

基本的には公式ドキュメント通りにやれば良い。

iOS での Apache Cordova アプリの実行

詰まったところ

Macでリモートエージェントを起動してリモートデバイスでビルドを実行すると以下のエラーが。

No matching provisioning profiles found: No provisioning profiles matching the bundle identifier “aaa.bbb.ccc” were found.

解決

AppIDがクセモノだった

プロビジョニング作成時に登録したAppIDとVisual Studio 2015で指定しているパッケージ名をあわせなければいけない。

f:id:KongariBug:20160113132154p:plain

f:id:KongariBug:20160113132158p:plain

問題は、AppIDの方はハイフンを入れて作れるのだが、Visual Studioの方のパッケージ名にはハイフンを入れられないので、AppIDにハイフンを入れて作ってしまうとはまる。
AppIDをハイフンなしで作りなおして名前を合わせればビルド成功。