はじめに
ios開発をしたいな〜と思い、色々ググったらReactnativeのことを知りました。
環境構築にハマったので、その葛藤を備忘録に残します。
あくまで個人の備忘録ですが、困っている人の助けになればいいなと思います。
初めての投稿ですのでお手柔らかにお願いします。
目次
- はじめに
- 開発環境
- node
- watchman
- インストール
- ハマった...
- 対策
- 結果
- 参考
開発環境
Mac OS X
(windowsのかたごめんなさい)
node・npm
- v11.2.0
- 6.4.1
watchman
watchmanをインストールします。
$ brew install watchman
インストール
React Native CLIをインストールします。
$ npm install -g react-native-cli
ですが、ここでハマりました。
ハマった...
npm ERR! code EACCES
npm ERR! errno -13
npm ERR! syscall access
npm ERR! Error: EACCES: permission denied, access '/Users/userName/.npm-global/lib/node_modules/react-native-cli'
npm ERR! { [Error: EACCES: permission denied, access '/Users/userName/.npm-global/lib/node_modules/react-native-cli']
npm ERR! stack:
npm ERR! "Error: EACCES: permission denied, access '/Users/userName/.npm-global/lib/node_modules/react-native-cli'",
npm ERR! errno: -13,
npm ERR! code: 'EACCES',
npm ERR! syscall: 'access',
npm ERR! path: '/Users/userName/.npm-global/lib/node_modules/react-native-cli' }
npm ERR!
npm ERR! The operation was rejected by your operating system.
npm ERR! It is likely you do not have the permissions to access this file as the current user
npm ERR!
npm ERR! If you believe this might be a permissions issue, please double-check the
npm ERR! permissions of the file and its containing directories, or try running
npm ERR! the command again as root/Administrator (though this is not recommended).
対策
1.グローバルインストールのためのディレクトリを作成する
$ mkdir ~/.npm-global
2.新しいディレクトリを使う設定をnpmで行う
$ npm config set prefix $'~/.npm-global'
3.~/.profileを開くか作成し，以下の行を追加する
$ export PATH=~/.npm-global/bin:$PATH
4.3の変更を反映する
$ source ~/.profile
#結果
もう一度インストールします。
$ npm install -g react-native-cli
お！？さっきとは違う
$ /Users/userName/.npm-global/bin/react-native -> /Users/userName/.npm-global/lib/node_modules/react-native-cli/index.js
+ react-native-cli@2.0.1
updated 1 package in 1.937s
無事インストールできました！！
$ react-native -v
react-native-cli: 2.0.1
react-native: n/a - not inside a React Native project directory
$ react-native init sample
上記のコマンドでフォルダを作成して実行します
react-native run-ios
# 参考
- [【React Native入門】Java Scriptでアプリ作ろう【Reactやったことない人向け】１](https://qiita.com/YutamaKotaro/items/dd7846c6db15e2307daa)
- [macで1からReactの環境構築をするのだ](https://qiita.com/spice/items/b75afb607f1d2e1172a2)
- [【React Native勉強メモ】環境構築手順](https://qiita.com/akatsukaha/items/4f1615b4ee1ddc214c80)
- [macでreact nativeの環境構築をして、iosアプリのhello worldをする](https://joppot.info/2016/03/16/3059)
- [npmでpermission deniedになった時の対処法[mac]](https://qiita.com/okoysm/items/ced3c3de30af1035242d)
参考にさせて頂いた皆様、ありがとうございます。