首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何在同一个项目中配置React Js和React Native?

如何在同一个项目中配置React Js和React Native?
EN

Stack Overflow用户
提问于 2018-07-27 21:13:15
回答 1查看 317关注 0票数 2

我想在同一个项目中为redux和样式表使用react js for web和react native for mobile。

我见过这样的git repos ReactNativeWebHelloWorld,但我认为这个应用程序是用旧版本编写的,所以我无法让它工作。我猜世博会将作为新版本的默认版本。我无法摆脱这个问题。

有没有可能用React 16和React Native ^ 0.5,Expo来做到这一点?编辑:对于package.json

代码语言:javascript
复制
{
  "name": "ReactNativeWebHelloWorld",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "react-native-scripts start",
    "ios-bundle": "react-native bundle --dev false --entry-file index.ios.js --platform ios --bundle-output ios/main.jsbundle",
    "ios-dev-bundle": "react-native bundle --entry-file index.ios.js --platform ios --bundle-output ios/main.jsbundle",
    "android-bundle": "react-native bundle --dev false --entry-file index.android.js --platform android --bundle-output android/app/src/main/assets/index.android.bundle",
    "android-dev-bundle": "react-native bundle --entry-file index.android.js --platform android --bundle-output android/app/src/main/assets/index.android.bundle",
    "web-bundle": "webpack --config web/webpack/web.prod.config.js --progress --colors",
    "web-dev": "webpack-dev-server --content-base web/public/ --config web/webpack/web.dev.config.js --port 3001 --inline --hot --colors",
    "clear-cache": "gulp clear-cache"
  },
  "dependencies": {
    "babel": "^6.3.26",
    "babel-polyfill": "^6.3.14",
    "clone": "^2.1.1",
    "morgan": "^1.6.1",
    "object-assign": "^4.0.1",
    "react": "^16.4.1",
    "react-dom": "^16.4.1",
    "react-native": "^0.56.0",
    "react-redux": "^5.0.7",
    "redux": "^3.1.1",
    "redux-thunk": "^2.3.0",
    "superagent": "^3.8.3",
    "expo": "^27.0.1"
  },
  "devDependencies": {
    "autoprefixer": "^9.0.1",
    "autoprefixer-loader": "^3.2.0",
    "babel-core": "^6.4.5",
    "babel-loader": "^7.1.5",
    "babel-plugin-react-transform": "^3.0.0",
    "babel-preset-es2015": "^6.3.13",
    "babel-preset-react": "^6.3.13",
    "css-loader": "^1.0.0",
    "gulp": "^3.9.0",
    "json-loader": "^0.5.4",
    "less": "^3.8.0",
    "less-loader": "^4.1.0",
    "react-native-cli": "^2.0.1",
    "react-transform-catch-errors": "^1.0.1",
    "react-transform-hmr": "^1.0.1",
    "redbox-react": "^1.3.2",
    "redux": "^4.0.0",
    "redux-devtools": "^3.3.1",
    "redux-devtools-dock-monitor": "^1.1.1",
    "redux-devtools-log-monitor": "^1.0.11",
    "redux-logger": "^3.0.6",
    "style-loader": "^0.21.0",
    "webpack": "^4.16.3",
    "webpack-dev-middleware": "^3.1.3",
    "webpack-dev-server": "^3.1.5",
    "webpack-hot-middleware": "^2.6.4",
    "react-native-scripts": "1.14.0",
    "jest-expo": "~27.0.0",
    "react-test-renderer": "16.3.1"
  },
  "jest": {
    "preset": "jest-expo"
  }
}

编辑:当我想在android模拟器上运行时,我会看到这个警告和错误

代码语言:javascript
复制
E:\NewProjects\react-native-web-hello-world-master>react-native run-android
Scanning folders for symlinks in E:\NewProjects\react-native-web-hello-world-master\node_modules (65ms)Starting JS server...
Building and installing the app on the device (cd android && gradlew.bat installDebug)...
Starting a Gradle Daemon, 1 incompatible and 1 stopped Daemons could not be reused, use --status for details
cache fileHashes.bin (C:\Users\H³seyin\.gradle\caches\4.9\fileHashes\fileHashes.bin) is corrupt. Discarding.

> Configure project :app
WARNING: Configuration 'compile' is obsolete and has been replaced with 'implementation'.
It will be removed at the end of 2018

> Task :app:mergeDebugResources FAILED
Error: E:\NewProjects\react-native-web-hello-world-master\android\app\build\intermediates\incremental\mergeDebugResources\merged.dir\values\values.xml (Eri■im engellendi)

FAILURE: Build failed with an exception.

* What went wrong:
Failed to capture snapshot of output files for task ':app:mergeDebugResources' property 'incrementalFolder' during up-to-date check.
> Could not read path 'E:\NewProjects\react-native-web-hello-world-master\android\app\build\intermediates\incremental\mergeDebugResources\merged.dir\values'.

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log
output. Run with --scan to get full insights.

* Get more help at https://help.gradle.org

BU¦LD FAILED in 17s
11 actionable tasks: 1 executed, 10 up-to-date
Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/getting-started.html
EN

回答 1

Stack Overflow用户

发布于 2018-07-27 21:26:02

我同时也在运行API和react

代码语言:javascript
复制
"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "react": "webpack-dev-server --open --mode development",
    "api": "nodemon ./bin/www",
    "start": "concurrently \"npm run react\" \"npm run api\"",
    "build": "webpack --mode production"
  }
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51558739

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档