如何使用不同的App.js文件运行react native

8aqjt8rx  于 2023-05-18  发布在  React
关注(0)|答案(2)|浏览(169)

有时候我需要使用不同的App.js文件来运行我的react原生应用程序,我们称之为App2.js。我正在手动修改index.js

import { AppRegistry } from 'react-native'

//const myApp = require('./src/App2').default
const myApp = require('./src/App').default

AppRegistry.registerComponent('Dummy app, () => myApp)

有没有可能在package.json中添加脚本?类似于react-native start:app2或不同的方式。
我看了一下react native cli文档和start命令没有任何类似的东西。只有--projectRoot,这不是我真正想要的。

nnsrf1az

nnsrf1az1#

打开package.json文件。添加一个具有自定义名称的新脚本项,如“start:app2”,并将其值设置为要执行的命令。在本例中,将是修改后的index.js文件导入App2.js。更新后的package.json脚本部分应该如下所示:

"scripts": {
  "start": "node node_modules/react-native/local-cli/cli.js start",
  "start:app2": "node node_modules/react-native/local-cli/cli.js start --entry-file ./src/App2.js"
}
sulc1iza

sulc1iza2#

您可以使用react-native-dotenv。npm install --save react-native-dotenv
配置应为:
index.js

import {AppRegistry} from 'react-native';
import App1 from './App1.js';
import App2 from './App2.js';
import {name as appName} from './app.json';

import {APP_NAME} from '@env';

const apps = {
  app1: App1,
  app2: App2,
};

AppRegistry.registerComponent(appName, () => apps[APP_NAME]);

最后关于package.json

"scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "lint": "eslint .",
    "start": "react-native start",
    "test": "jest",
    "app1": "APP_NAME=app1 npx react-native start --reset-cache", <== this
    "app2": "APP_NAME=app2 npx react-native start --reset-cache" <== this
  },

请注意,重置缓存选项是必需的。

相关问题