Androidアプリの開発にreact-native
フレームワークを使用しています。 Toolbar
を作成するためにreact-native-material-design
ライブラリを使用し、さらにいくつかの機能を追加したいと思います。
私のプロジェクトが以下のコマンドを使用している現在のディレクトリにこのライブラリをインストールしました:
E:\>npm i react-native-material-design -g --save
C:\Users\ch-e00925\AppData\Roaming\npm
`-- [email protected]
+-- [email protected] (git+https://github.com/react-n
ative-material-design/react-native-material-design-styles.git#bdc029c1a1c83ff563
d10868be38b8aed1e9989b)
`-- [email protected]
+-- [email protected]
`-- [email protected]
+-- [email protected]
| +-- [email protected]
| | `-- [email protected]
| `-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
| `-- [email protected]
| `-- [email protected]
+-- [email protected]
| +-- [email protected]
| | +-- [email protected]
| | `-- [email protected]
| | `-- [email protected]
| `-- [email protected]
| +-- [email protected]
| | +-- [email protected]
| | +-- [email protected]
| | | `-- [email protected]
| | | `-- [email protected]
| | +-- [email protected]
| | `-- [email protected]
| | `-- [email protected]
| +-- [email protected]
| | +-- [email protected]
| | +-- [email protected]
| | | `-- [email protected]
| | +-- [email protected]
| | `-- [email protected]
| | +-- [email protected]
| | | `-- [email protected]
| | `-- [email protected]
| `-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
| +-- [email protected]
| `-- [email protected]
| `-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
`-- [email protected]
`-- [email protected]
E:\>
この後、アプリケーションの実行中に1つの問題が発生しますが、ライブラリが正常にインストールされなかった可能性があります。
E:\Myntra>react-native start
Scanning 557 folders for symlinks in E:\Myntra\node_modules (114ms)
┌────────────────────────────────────────────────────────────────────────────┐
│ Running packager on port 8081. │
│ │
│ Keep this packager running while developing on any JS projects. Feel │
│ free to close this tab and run your own packager instance if you │
│ prefer. │
│ │
│ https://github.com/facebook/react-native │
│ │
└────────────────────────────────────────────────────────────────────────────┘
Looking for JS files in
E:\Myntra
[01/23/2017, 13:36:07] <START> Initializing Packager
[01/23/2017, 13:36:08] HMR Server listening on /hot
React packager ready.
[01/23/2017, 13:36:12] <START> Requesting bundle
bundle_url: /index.Android.bundle?platform=androi
d&dev=true&hot=true&minify=false
[01/23/2017, 13:36:40] <START> Building Haste Map
[01/23/2017, 13:36:40] <END> Building Haste Map (141ms)
[01/23/2017, 13:36:40] <END> Initializing Packager (33314ms)
[01/23/2017, 13:36:40] <START> Transforming files
transformed 584/607 (96%)(node:6316) UnhandledPromiseRejectionWarning: Unhandled
promise rejection (rejection id: 605): UnableToResolveError: Unable to resolve
module react-native-material-design-styles from E:\Myntra\node_modules\react-nat
ive-material-design\lib\config.js: Module does not exist in the module map or in
these directories:
E:\Myntra\node_modules\react-native-material-design\node_modules
, E:\Myntra\node_modules
This might be related to https://github.com/facebook/react-native/issues/4968
To resolve try the following:
1. Clear watchman watches: `watchman watch-del-all`.
2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.
3. Reset packager cache: `rm -fr $TMPDIR/react-*` or `npm start -- --reset-cac
he`.
[01/23/2017, 13:54:09] <START> Requesting bundle
bundle_url: /index.Android.bundle?platform=androi
d&dev=true&hot=true&minify=false
PS:私はWindows 7マシンにいますが、コマンドを実行する方法を見つけることができませんでした。私はこれを見ました 開発サーバーが応答エラーコードを返しました:反応ネイティブで5 しかし、それは私を助けませんでした。
誰でもこの問題を解決するのを手伝ってもらえますか。前もって感謝します。
グローバルではなくローカルでreact-native-material-design
をインストールしてみてください。
React-native-material-designは、その親がグローバルモジュールであるため、React Nativeのbundlerによってパッケージ化されないreact-native-material-design-styleに依存しているように見えます。
babel-preset-react-native
はこの問題を引き起こします。プロジェクトルートディレクトリで次の順序で実行します。
$ yarn remove babel-preset-react-native
$ yarn add [email protected]
いつかこのエラーが発生します .js
ファイルの正しいパスを指定しない場合
Correct パスを入力する代わりに:
var WeatherProject = require('./Main/WeatherProject');
Wrong Path is typed(capitalization、spelling error、special symbols):
var WeatherProject = require('./WeatherProject');
私はポート8081で同じ問題を抱えていましたが、8082に変更します。すでに他のサービスで使用されているため、作業が進んでいます
最初にPackage Serverを実行します:Blockquote
react-native start --port 8082
別のコマンドプロンプトを開き、通常どおりAndroidアプリを起動します。
react-native run-Android
終了したら、adbがトンネリングするtcpポートを書き換えます。
adb reverse tcp:8081 tcp:8082
Adb tcpトンネルのリストを参照してください。
adb reverse --list
これで、次のようなメッセージが表示されます。
(reverse) tcp:8081 tcp:8082
実行されるアプリを確認してください...........!
私は同じ問題を抱えていました、私のノードモジュールの1つはうまく設定されていませんでした(反応ナビゲーション)
npm install react-navigation --save
最初に実行して、バージョン番号を取得します。
C:\WINDOWS\system32>react-native -v react-native-cli
2.0.1反応ネイティブ:0.56.0
次に、react-nativeをアンインストールしました。
C:\WINDOWS\system32>npm uninstall -g react-native-cli
3.999で41個のパッケージを削除
次に、react-nativeをインストールしました。
npm install [email protected]
次に、react-native-cliをインストールしました。
npm install -g [email protected]
次に、このインストールを使用して、react-nativeプロジェクトを作成します。
react-native init --version="0.55.4" myprojectname
このエラーが発生した理由の1つは、「react-native」ライブラリを2回インポートしたためです。
import { View, Text, ActivityIndicator } from "react-native";
import { View, Text, ActivityIndicator, TouchableOpacity, StyleSheet } from "react-native";
これが本当にこの問題を引き起こす可能性があるかはわかりませんが、インポートの冗長な行を削除することでこの問題は解決しました。
エラーコード500でこの種のエラーが発生した場合はいつでも。この背後にある次の理由があります。
1)Linuxシステムで作業している可能性があります。端末でアプリケーションを実行し、デバイスではなくAndroidシミュレーターにチェックインする必要があります。
2)上記で作業する場合は、シミュレーターの妻がオフになっていることを確認してから、Studioで作業してください完全に動作します。
あなたが解決策を得ることを願っています。
1)Linuxシステムで作業している可能性があります。端末でアプリケーションを実行し、デバイスではなくAndroidシミュレーターにチェックインする必要があります。
2)上記で作業する場合は、シミュレーターWifiがオフになっていることを確認してから、Studioで作業してください。完全に動作します。
3)同時にマルチパル端末またはコマンドウィンドウを開かないようにしてください。その後、それを閉じます
React-nativeフィールドの新参者として、私はかつてこのエラー負荷に直面していましたが、いつも混乱してしまいました。しかし、サーバーが存在しない場所から何かをインポートしようとすると、少しの経験を積んだことがわかりました。
したがって、インポートするものすべてをチェックし、それが存在する場合でも、開始する必要があります。
これは、アンインストールされたパッケージなどに対してこのエラーがポップアップするのではなく、間違ったものをインポートしたり、間違った場所からインポートしたりした場合でも同様です。
npm start —–reset-cache
を実行しますreact-native run-Android
を実行します反応ネイティブバージョン:56.0を使用している場合、バージョン54にダウングレードします。
react-native bundle --platform Android --dev false --entry-file index.js --bundle-output Android/app/src/main/assets/index.Android.bundle --assets-dest Android/app/src/main/res
このコマンドを実行します。これにより、タグを2回閉じるか、モジュールが見つからないなどのエラーが表示されます。
linuxベースのシステムでコマンドの前にSudoを使用する
stores
またはトップレベルのコンポーネントを使用している場合。削除する場合は、他の場所にインポートされていないことを確認してください。
私の場合、最上位にインポートされていたストアを削除しました。
インポートしたJavaScriptファイルの名前は、React事前定義ライブラリ/コンポーネントと同じである可能性があります。たとえば、作成したフォルダーapp/componentsからView.jsをインポートします。
import View from './app/components/View'
上記のステートメントはエラーを生成します。そのため、ファイルの名前をInterface.jsに変更します
import Interface from './app/components/Interface'
これで、コードはうまく実行できます