| Linuxコマンド |
| 用語集 |
| debian メモ |
| apache2 メモ |
| MySQL メモ |
| Oracle メモ |
| PostgreSQL |
| HOME |
React Native CLIをインストールします。
◆環境| OS | Windows 10 Home 20H2 64bit OS x64 プロセッサ |
|---|
PowerShellでのyarnを使ったReact Native CLIのインストールコマンドです。
参考:yarnインストール
PowerShellを管理者で実行しコマンドを実行します。
yarn global v1.22.15
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Installed "react-native-cli@2.0.1" with binaries:
- react-native
Done in 7.17s.
PS C:\Windows\system32>
プロジェクトの作成
React Nativeのプロジェクトを作成するコマンドです。
React Nativeのプロジェクトを作成したいフォルダに移動してコマンドを実行します。
This will walk you through creating a new React Native project in C:\
src\RNTestUsing yarn v1.22.15
Installing react-native...
yarn add v1.22.15
info No lockfile found.
[1/4] Resolving packages...
warning react-native > @react-native-community/cli-platform-ios > xco
de > uuid@3.4.0: Please upgrade to version 7 or higher. Older ver
sions may use Math.random() in certain circumstances, which is know
n to be problematic. See https://v8.dev/blog/math-random for detai
ls.warning react-native > @react-native-community/cli > @react-native-co
mmunity/cli-plugin-metro > metro > metro-minify-uglify > uglify-es@
3.3.9: support for ECMAScript is superseded by `uglify-js` as of v3
.13.0warning react-native > @react-native-community/cli > @react-native-co
mmunity/cli-plugin-metro > metro-core > jest-haste-map > sane@4.1.0
: some dependency vulnerabilities fixed, support for node < 10 drop
ped, and newer ECMAScript syntax/features addedwarning react-native > react-native-codegen > jscodeshift > micromatc
h > snapdragon > source-map-resolve > resolve-url@0.2.1: https://gi
thub.com/lydell/resolve-url#deprecatedwarning react-native > react-native-codegen > jscodeshift > micromatc
h > snapdragon > source-map-resolve > urix@0.1.0: Please see https:
//github.com/lydell/urix#deprecated[2/4] Fetching packages...
info fsevents@2.3.2: The platform "win32" is incompatible with this m
odule.info "fsevents@2.3.2" is an optional dependency and failed compatibil
ity check. Excluding it from installation.[3/4] Linking dependencies...
warning "react-native > use-subscription@1.5.1" has unmet peer depend
ency "react@^16.8.0 || ^17.0.0".warning "react-native > metro-react-native-babel-transformer@0.66.2"
has unmet peer dependency "@babel/core@*".warning "react-native > react-native-codegen > jscodeshift@0.11.0" ha
s unmet peer dependency "@babel/preset-env@^7.1.6".warning " > react-native@0.66.2" has unmet peer dependency "react@17.
0.2".[4/4] Building fresh packages...
success Saved lockfile.
success Saved 376 new dependencies.
info Direct dependencies
└─ react-native@0.66.2
info All dependencies
├─ @babel/code-frame@7.16.0
├─ @babel/compat-data@7.16.0
:
略(372行)
:
├─ y18n@4.0.3
└─ yargs-parser@18.1.3
Done in 33.06s.
info Setting up new React Native app in C:\src\RNTest
info Fetching template react-native-template-typescript...
(node:8912) Warning: Accessing non-existent property 'padLevels' of m
odule exports inside circular dependency(Use `node --trace-warnings ...` to show where the warning was create
d)yarn add v1.22.15
[1/4] Resolving packages...
warning @react-native-community/eslint-config > babel-eslint@10.1.0:
babel-eslint is now @babel/eslint-parser. This package will no long
er receive updates.[2/4] Fetching packages...
info fsevents@2.3.2: The platform "win32" is incompatible with this m
odule.info "fsevents@2.3.2" is an optional dependency and failed compatibil
ity check. Excluding it from installation.[3/4] Linking dependencies...
warning "react-native > react-native-codegen > jscodeshift@0.11.0" ha
s unmet peer dependency "@babel/preset-env@^7.1.6".warning "@react-native-community/eslint-config > @typescript-eslint/e
slint-plugin > tsutils@3.21.0" has unmet peer dependency "typescrip
t@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5
.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0
-beta".[4/4] Building fresh packages...
success Saved lockfile.
success Saved 202 new dependencies.
info Direct dependencies
├─ @react-native-community/eslint-config@2.0.0
├─ eslint@7.14.0
├─ jest@26.6.3
├─ react-native-template-typescript@6.8.2
├─ react-test-renderer@17.0.2
└─ react@17.0.2
info All dependencies
├─ @babel/plugin-syntax-async-generators@7.8.4
├─ @babel/plugin-syntax-bigint@7.8.3
:
略(198行)
:
├─ xmlchars@2.2.0
└─ yallist@4.0.0
Done in 20.07s.
info Adding dependencies for the project...
info No additional dependencies.
info Adding develop dependencies for the project...
info No additional develop dependencies.
yarn remove v1.22.15
[1/2] Removing module react-native-template-typescript...
[2/2] Regenerating lockfile and installing missing dependencies...
info fsevents@2.3.2: The platform "win32" is incompatible with this m
odule.info "fsevents@2.3.2" is an optional dependency and failed compatibil
ity check. Excluding it from installation.warning "react-native > react-native-codegen > jscodeshift@0.11.0" ha
s unmet peer dependency "@babel/preset-env@^7.1.6".warning "@react-native-community/eslint-config > @typescript-eslint/e
slint-plugin > tsutils@3.21.0" has unmet peer dependency "typescrip
t@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5
.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0
-beta".success Uninstalled packages.
Done in 1.93s.
info Adding required dependencies
yarn add v1.22.15
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.3.2: The platform "win32" is incompatible with this m
odule.info "fsevents@2.3.2" is an optional dependency and failed compatibil
ity check. Excluding it from installation.[3/4] Linking dependencies...
warning "react-native > react-native-codegen > jscodeshift@0.11.0" ha
s unmet peer dependency "@babel/preset-env@^7.1.6".warning "@react-native-community/eslint-config > @typescript-eslint/e
slint-plugin > tsutils@3.21.0" has unmet peer dependency "typescrip
t@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5
.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0
-beta".[4/4] Building fresh packages...
success Saved 0 new dependencies.
Done in 1.96s.
info Adding required dev dependencies
yarn add v1.22.15
[1/4] Resolving packages...
[2/4] Fetching packages...
warning Pattern ["@babel/core@^7.16.0"] is trying to unpack in the sa
me destination "C:\\Users\\xxxxx\\AppData\\Local\\Yarn\\Cache\\v6\\
npm-@babel-core-7.16.0-c4ff44046f5fe310525cc9eb4ef5147f0c5374d4-int
egrity\\node_modules\\@babel\\core" as pattern ["@babel/core@^7.14.
0","@babel/core@^7.14.0","@babel/core@^7.14.0","@babel/core@^7.14.0
","@babel/core@^7.1.6","@babel/core@^7.14.0","@babel/core@^7.14.0",
"@babel/core@^7.14.0","@babel/core@^7.7.5","@babel/core@^7.1.0","@b
abel/core@^7.1.0","@babel/core@^7.12.3","@babel/core@^7.7.2","@babe
l/core@^7.14.0"]. This could result in non-deterministic behavior,
skipping.warning Pattern ["@babel/runtime@^7.16.0"] is trying to unpack in the
same destination "C:\\Users\\xxxxx\\AppData\\Local\\Yarn\\Cache\\v
6\\npm-@babel-runtime-7.16.0-e27b977f2e2088ba24748bf99b5e1dece64e4f
0b-integrity\\node_modules\\@babel\\runtime" as pattern ["@babel/ru
ntime@^7.8.4"]. This could result in non-deterministic behavior, sk
ipping.warning Pattern ["metro-react-native-babel-preset@^0.66.2"] is trying
to unpack in the same destination "C:\\Users\\xxxxx\\AppData\\Loca
l\\Yarn\\Cache\\v6\\npm-metro-react-native-babel-preset-0.66.2-fdde
bcf413ad4ea617d4f47f7c1da401052de734-integrity\\node_modules\\metro
-react-native-babel-preset" as pattern ["metro-react-native-babel-p
reset@0.66.2","metro-react-native-babel-preset@0.66.2"]. This could
result in non-deterministic behavior, skipping.info fsevents@2.3.2: The platform "win32" is incompatible with this m
odule.info "fsevents@2.3.2" is an optional dependency and failed compatibil
ity check. Excluding it from installation.[3/4] Linking dependencies...
warning "react-native > react-native-codegen > jscodeshift@0.11.0" ha
s unmet peer dependency "@babel/preset-env@^7.1.6".warning "@react-native-community/eslint-config > eslint-plugin-react@
7.26.1" has incorrect peer dependency "eslint@^3 || ^4 || ^5 || ^6
|| ^7".warning "@react-native-community/eslint-config > eslint-plugin-react-
native@3.11.0" has incorrect peer dependency "eslint@^3.17.0 || ^4
|| ^5 || ^6 || ^7".warning "@react-native-community/eslint-config > @typescript-eslint/e
slint-plugin@4.33.0" has incorrect peer dependency "eslint@^5.0.0 |
| ^6.0.0 || ^7.0.0".warning "@react-native-community/eslint-config > eslint-plugin-react-
hooks@4.2.0" has incorrect peer dependency "eslint@^3.0.0 || ^4.0.0
|| ^5.0.0 || ^6.0.0 || ^7.0.0".warning "@react-native-community/eslint-config > @typescript-eslint/e
slint-plugin > tsutils@3.21.0" has unmet peer dependency "typescrip
t@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5
.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0
-beta".warning "@react-native-community/eslint-config > @typescript-eslint/p
arser@4.33.0" has incorrect peer dependency "eslint@^5.0.0 || ^6.0.
0 || ^7.0.0".warning " > @react-native-community/eslint-config@3.0.1" has unmet pe
er dependency "prettier@>=2".[4/4] Building fresh packages...
success Saved lockfile.
success Saved 60 new dependencies.
info Direct dependencies
├─ @babel/core@7.16.0
├─ @babel/runtime@7.16.0
├─ @react-native-community/eslint-config@3.0.1
├─ babel-jest@27.3.1
├─ eslint@8.2.0
├─ jest@27.3.1
└─ metro-react-native-babel-preset@0.66.2
info All dependencies
├─ @babel/core@7.16.0
├─ @babel/runtime@7.16.0
:
略(56行)
:
├─ type-fest@0.20.2
└─ v8-to-istanbul@8.1.0
Done in 14.13s.
Run instructions for Android:
? Have an Android emulator running (quickest way to get started),
or a device connected.? cd "C:\src\RNTest" && npx react-native run-android
Run instructions for Windows:
? See https://aka.ms/ReactNativeGuideWindows for the latest up-to
-date instructions.PS C:\src>
2~3分かかりました。結構warnningが出ました。
Older versions may use Math.random() in certain circumstances, which
is known to be problematic.See https://v8.dev/blog/math-random for details.
バージョン7にアップグレードしてください。それより古いバージョンのMath.random()は問題があることが知られています。
ECMAScriptのサポートは、v3.13.0以降 uglify-js にかわりました。
and newer ECMAScript syntax/features added
いくつかの依存関係の脆弱性が修正され、node < 10のサポートが停止され、新しいECMAScriptの構文/機能が追加されました。
act@^16.8.0 || ^17.0.0"
「peer dependency」は依存先が自動的にはインストールされないものを指すようです。unmetなので未処理のpeer dependencyがある、ということのようです。
「react-native > use-subscription@1.5.1」は「react@^16.8.0 || ^17.0.0」へのpeer dependencyが満たされていない。となりそうですが、どうすればよいか分かりませんでした。
同じ文のwarinigがあと3つ出ています。
t peer dependency "@babel/core@*"."react-native > react-native-codegen > jscodeshift@0.11.0" has unmet
peer dependency "@babel/preset-env@^7.1.6"." > react-native@0.66.2" has unmet peer dependency "react@17.0.2".
circular dependency
依存関係の中のexportsモジュールに存在しないプロパティ"padLevels"へアクセスしたようです。
This package will no longer receive updates.
「babel-eslint」は「@babel/eslint-parser」になりました。このパッケージは今後更新を受けません。
また unmet peer dependency が2つ出ています。
peer dependency "@babel/preset-env@^7.1.6"."@react-native-community/eslint-config > @typescript-eslint/eslint-pl
ugin > tsutils@3.21.0" has unmet peer dependency "typescript@>=2.8.
0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev |
| >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".また unmet peer dependency が2つ出ています。前回と同じ内容です。
peer dependency "@babel/preset-env@^7.1.6"."@react-native-community/eslint-config > @typescript-eslint/eslint-pl
ugin > tsutils@3.21.0" has unmet peer dependency "typescript@>=2.8.
0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev |
| >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".また unmet peer dependency が2つ出ています。今回も前回と同じ内容です。
peer dependency "@babel/preset-env@^7.1.6"."@react-native-community/eslint-config > @typescript-eslint/eslint-pl
ugin > tsutils@3.21.0" has unmet peer dependency "typescript@>=2.8.
0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev |
| >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".
nation "C:\\Users\\...\\@babel\\core" as pattern[
"@babel/core@^7.14.0"
,"@babel/core@^7.14.0"
,"@babel/core@^7.14.0"
,"@babel/core@^7.14.0"
,"@babel/core@^7.1.6"
,"@babel/core@^7.14.0"
,"@babel/core@^7.14.0"
,"@babel/core@^7.14.0"
,"@babel/core@^7.7.5"
,"@babel/core@^7.1.0"
,"@babel/core@^7.1.0"
,"@babel/core@^7.12.3"
,"@babel/core@^7.7.2"
,"@babel/core@^7.14.0"
].
This could result in non-deterministic behavior, skipping.
パターン「@babel/core@^7.16.0"」はパターン「"@babel/core@^7.14.0",...」と同じ保存先に解答しようとしています。 これにより non-deterministic behavior(非決定論的動作?)、スキップが発生します。
同じwarningが2つ出ています。
stination "C:\\Users\\...\\@babel\\runtime" as pattern ["@babel/run
time@^7.8.4"]. This could result in non-deterministic behavior, ski
pping.Pattern ["metro-react-native-babel-preset@^0.66.2"] is trying to unpa
ck in the same destination "C:\\Users\\...\\metro-react-native-babe
l-preset" as pattern ["metro-react-native-babel-preset@0.66.2","met
ro-react-native-babel-preset@0.66.2"]. This could result in non-det
erministic behavior, skipping.また unmet peer dependencyが出ています。
peer dependency "@babel/preset-env@^7.1.6".
has incorrect peer dependency "eslint@^3 || ^4 || ^5 || ^6 || ^7".unmet ではなく incorrect(正しくない?)と表示されています。
incorrect peer dependencyが4件、unmet peer dependencyが2件出ていました。
.11.0" has incorrect peer dependency "eslint@^3.17.0 || ^4 || ^5 ||
^6 || ^7"."@react-native-community/eslint-config > @typescript-eslint/eslint-pl
ugin@4.33.0" has incorrect peer dependency "eslint@^5.0.0 || ^6.0.0
|| ^7.0.0"."@react-native-community/eslint-config > eslint-plugin-react-hooks@4.
2.0" has incorrect peer dependency "eslint@^3.0.0 || ^4.0.0 || ^5.0
.0 || ^6.0.0 || ^7.0.0"."@react-native-community/eslint-config > @typescript-eslint/eslint-pl
ugin > tsutils@3.21.0" has unmet peer dependency "typescript@>=2.8.
0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev |
| >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta"."@react-native-community/eslint-config > @typescript-eslint/parser@4.
33.0" has incorrect peer dependency "eslint@^5.0.0 || ^6.0.0 || ^7.
0.0"." > @react-native-community/eslint-config@3.0.1" has unmet peer depen
dency "prettier@>=2".「Done」で区切ると5つのステップが実施されたようです。
src\RNTestUsing yarn v1.22.15
Installing react-native...
yarn add v1.22.15
info No lockfile found.
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
success Saved 376 new dependencies.
Done in 33.06s.
「Installing react-native...」と表示されています。
info Fetching template react-native-template-typescript...
yarn add v1.22.15
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
success Saved 202 new dependencies.
Done in 20.07s.
「Setting up new React Native app」と表示されています。
info No additional dependencies.
info Adding develop dependencies for the project...
info No additional develop dependencies.
yarn remove v1.22.15
[1/2] Removing module react-native-template-typescript...
[2/2] Regenerating lockfile and installing missing dependencies...
success Uninstalled packages.
Done in 1.93s.
最後に「success Uninstalled packages」と表示されています。
yarn add v1.22.15
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved 0 new dependencies.
Done in 1.96s.
「required dependencies」と表示されています。
yarn add v1.22.15
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
success Saved 60 new dependencies.
Done in 14.13s.
「required dev dependencies」と表示されています。
warningの整理
react-native
「@react-native-community/cli-platform-ios > xcode > uuid@3.4.0: Please upgrade to version 7 or higher.」はupgradeすれば解消しそうです。
他の3つは依存関係の問題のようです。
| use-subscription | 1.5.1 | react@^16.8.0 || ^17.0.0 |
| metro-react-native-babel-transformer | 0.66.2 | @babel/core@*". |
| react-native-codegen > jscodeshift | 0.11.0 | @babel/preset-env@^7.1.6". |
また「react-native@0.66.2」も「react@17.0.2」がpeer dependencyのようです。
@react-native-community/eslint-config
「babel-eslint@10.1.0: babel-eslint is now @babel/eslint-parser. This package will no longer receive updates.」はbabel-eslintがeslint-parserに代わったというものなので問題ないと思います。
他の6つは依存関係の問題のようです。
| eslint-plugin-react | 7.26.1 | eslint@^3 || ^4 || ^5 || ^6 || ^7 |
| eslint-plugin-react-native | 3.11.0 | eslint@^3.17.0 || ^4 || ^5 || ^6 || ^7 |
| eslint-plugin-react-hooks | 4.2.0 | eslint@^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 |
@react-native-community/eslint-config@typescript-eslint
| eslint-plugin > tsutils | 3.21.0 | typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta |
| eslint-plugin | 4.33.0 | eslint@^5.0.0 || ^6.0.0 || ^7.0.0 |
| parser | 4.33.0 |
Pattern is trying to unpack in the same destination
| @babel/core@^7.16.0 | @babel/core@^7.1.0 @babel/core@^7.1.6 @babel/core@^7.7.2 @babel/core@^7.7.5 @babel/core@^7.12.3 @babel/core@^7.14.0 |
| @babel/runtime@^7.16.0 | @babel/runtime@^7.8.4 |
| metro-react-native-babel-preset@^0.66.2 | metro-react-native-babel-preset@0.66.2 |
「@react-native-community/eslint-config@3.0.1" has unmet peer dependency "prettier@>=2"」は「@react-native-community/eslint-config」が「prettier@>=2」とpeer dependencyのようです。
パス
以下のパスにいろいろできていました。
\ npm-@babel-core-7.16.0-...-integrity
\ node_modules
\ @babel
\ core
\ npm-@babel-runtime-7.16.0-...-integrity
\ node_modules
\ @babel
\ runtime
\ npm-metro-react-native-babel-preset-0.66.2-...-integrity
\ node_modules
\ metro-react-native-babel-preset
致命的なエラーは出ていないようですが、warningが多く正しくできているのかわかりません。
Copyright (C) 2021 ymlib.com
