search

wuba / Taro-Mortgage-Calculator

首个 Taro 3 多端统一实例 - 支持 React Native，Weapp，H5。
https://wuba.github.io/Taro-Mortgage-Calculator
MIT License
377 stars 86 forks source link

#BUG#demo不能跑起来 #13

Closed BinZhiZhu closed 3 years ago

BinZhiZhu commented 3 years ago

根据readme最后终端执行没有报错，如下： 


$ taro build --type rn --platform android --watch --port 8081
👽 Taro v3.2.0-canary.5

Tips: 预览模式生成的文件较大，设置 NODE_ENV 为 production 可以开启压缩。
Example:
$ NODE_ENV=production taro build --type rn --watch

  #####   ##   #####   ####     #####  ######   ##    ####  #####    #    #   ##   ##### # #    # ######
    #    #  #  #    # #    #    #    # #       #  #  #    #   #      ##   #  #  #    #   # #    # #
    #   #    # #    # #    #    #    # #####  #    # #        #      # #  # #    #   #   # #    # #####
    #   ###### #####  #    #    #####  #      ###### #        #      #  # # ######   #   # #    # #
    #   #    # #   #  #    #    #   #  #      #    # #    #   #      #   ## #    #   #   #  #  #  #
    #   #    # #    #  ####     #    # ###### #    #  ####    #      #    # #    #   #   #   ##   ######

React-Native Dev server is running on port: 8081

To reload the app press "r"
To open developer menu press "d"
                 Welcome to React Native!
                Learn once, write anywhere

但是浏览器访问127.0.0.1:8081 提示：GET http://127.0.0.1:8081/ 404 (Not Found)

跟预期的完全不一致呀，请问这是什么问题，我看了下编译后的文件：

➜  dist git:(master) tree
.
└── rn
    └── ios
        ├── assets
        │   ├── node_modules
        │   │   ├── @react-navigation
        │   │   │   └── stack
        │   │   │       └── lib
        │   │   │           └── commonjs
        │   │   │               └── views
        │   │   │                   └── assets
        │   │   │                       ├── back-icon-mask.png
        │   │   │                       ├── back-icon.png
        │   │   │                       ├── back-icon@2x.png
        │   │   │                       └── back-icon@3x.png
        │   │   └── @tarojs
        │   │       ├── components-rn
        │   │       │   └── dist
        │   │       │       └── assets
        │   │       │           ├── loading-warn.png
        │   │       │           ├── loading.png
        │   │       │           └── video
        │   │       │               └── play.png
        │   │       └── taro-rn
        │   │           └── dist
        │   │               └── lib
        │   │                   ├── scanCode
        │   │                   │   ├── icon_close.png
        │   │                   │   └── icon_pic.png
        │   │                   └── showModal
        │   │                       └── success.png
        │   └── src
        │       └── assets
        │           └── images
        │               ├── comm_form_icon_gouxuan.png
        │               ├── comm_form_icon_weigouxuan.png
        │               ├── esf_calculator_icon_close.png
        │               ├── esf_calculator_icon_question.png
        │               ├── esf_calculator_img_bggradient.png
        │               ├── esf_calculator_img_building.png
        │               ├── esf_calculator_img_mark.png
        │               ├── esf_calculator_img_percent.png
        │               ├── yz_prop_icon_arrow.png
        │               └── yz_prop_icon_arrow_white.png
        └── main.jsbundle
qiuziz commented 3 years ago

访问这个http://localhost:8081/index.bundle?platform=android

BinZhiZhu commented 3 years ago

访问这个http://localhost:8081/index.bundle?platform=android 我浏览器访问 http://localhost:8081/index.bundle?platform=ios&dev=true 触发对应终端平台的 js bundle 构建如下：


➜  Taro-Mortgage-Calculator git:(master) ✗ yarn dev:rn --port 8081
yarn run v1.15.2
$ npm run build:rn -- --watch --port 8081
npm WARN lifecycle The node binary used for scripts is /var/folders/bg/dlf3207n7cd02x9c26bg02qm0000gn/T/yarn--1616156972956-0.16433634752153825/node but npm is using /usr/local/Cellar/node/11.10.0/bin/node itself. Use the `--scripts-prepend-node-path` option to include the path for the node binary npm was executed with.

mortgage_calculator@1.0.0 build:rn /Users/apple/docker/wwwroot/Taro-Mortgage-Calculator
yarn build:rn-ios && yarn build:rn-android "--watch" "--port" "8081"

$ taro build --type rn --platform ios 👽 Taro v3.2.0-canary.5

             Welcome to React Native!
            Learn once, write anywhere

transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/history/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/history/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/app.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/app.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/monthly-payments/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/monthly-payments/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/compute-header/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/compute-header/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/box-shadow/index.scss transform[stdout]: 启动 样式文件处理开始 src/components/safe-area-view/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/linear-gradient/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/linear-gradient/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/safe-area-view/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/keyboard-aware-scroll-view/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/keyboard-aware-scroll-view/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/modal/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/modal/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/picker/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/picker/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/box-shadow/index.scss Writing bundle output to: dist/rn/ios/main.jsbundle Done writing bundle output transform[stdout]: 启动 样式文件处理开始 src/app.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/app.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/monthly-payments/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/monthly-payments/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/history/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/history/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/compute-header/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/compute-header/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/safe-area-view/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/linear-gradient/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/safe-area-view/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/linear-gradient/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/modal/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/keyboard-aware-scroll-view/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/modal/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/keyboard-aware-scroll-view/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/picker/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/picker/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/box-shadow/index.scss transform[stdout]: 编译 样式文件处理完毕 src/components/box-shadow/index.scss info Copying 20 asset files info Done copying assets $ taro build --type rn --platform android --watch --port 8081 👽 Taro v3.2.0-canary.5

Tips: 预览模式生成的文件较大，设置 NODE_ENV 为 production 可以开启压缩。 Example: $ NODE_ENV=production taro build --type rn --watch

#    #  #  #    # #    #    #    # #       #  #  #    #   #      ##   #  #  #    #   # #    # #
#   #    # #    # #    #    #    # #####  #    # #        #      # #  # #    #   #   # #    # #####
#   ###### #####  #    #    #####  #      ###### #        #      #  # # ######   #   # #    # #
#   #    # #   #  #    #    #   #  #      #    # #    #   #      #   ## #    #   #   #  #  #  #
#   #    # #    #  ####     #    # ###### #    #  ####    #      #    # #    #   #   #   ##   ######

React-Native Dev server is running on port: 8081

To reload the app press "r" To open developer menu press "d" Welcome to React Native! Learn once, write anywhere

transform[stdout]: 启动 样式文件处理开始 src/app.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/app.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/monthly-payments/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/history/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/monthly-payments/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/history/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/compute-header/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/safe-area-view/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/safe-area-view/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/box-shadow/index.scss transform[stdout]: 编译 样式文件处理完毕 src/components/box-shadow/index.scss transform[stdout]: 启动 样式文件处理开始 src/components/modal/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/modal/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/linear-gradient/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/linear-gradient/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/picker/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/picker/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/compute-header/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/keyboard-aware-scroll-view/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/keyboard-aware-scroll-view/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/app.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/app.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/monthly-payments/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/monthly-payments/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/compute-header/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/compute-header/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/pages/calculator/history/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/pages/calculator/history/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/keyboard-aware-scroll-view/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/keyboard-aware-scroll-view/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/linear-gradient/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/linear-gradient/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/picker/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/picker/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/box-shadow/index.scss transform[stdout]: 编译 样式文件处理完毕 src/components/box-shadow/index.scss transform[stdout]: 启动 样式文件处理开始 src/components/safe-area-view/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/safe-area-view/index.rn.scss transform[stdout]: 启动 样式文件处理开始 src/components/modal/index.rn.scss transform[stdout]: 编译 样式文件处理完毕 src/components/modal/index.rn.scss [Fri Mar 19 2021 20:30:42.682] BUNDLE ./index

[Fri Mar 19 2021 20:30:47.554] BUNDLE ./index

[Fri Mar 19 2021 20:30:51.186] BUNDLE ./index

[Fri Mar 19 2021 20:30:52.152] BUNDLE ./index

[Fri Mar 19 2021 20:30:53.580] BUNDLE ./index

[Fri Mar 19 2021 20:30:57.859] BUNDLE ./index

[Fri Mar 19 2021 20:31:02.873] BUNDLE ./index

[Fri Mar 19 2021 20:41:44.520] BUNDLE ./index


此时我打开终端还是跑不起来，执行：react-native run-ios

➜ Taro-Mortgage-Calculator git:(master) ✗ react-native run-ios info Found Xcode workspace "taroDemo.xcworkspace" info Building (using "xcodebuild -workspace taroDemo.xcworkspace -configuration Debug -scheme taroDemo -destination id=965425FF-ABC6-492C-B456-28CFAC0CF6EA") error Failed to build iOS project. We ran "xcodebuild" command but it exited with error code 65. To debug build logs further, consider building your app with Xcode.app, by opening taroDemo.xcworkspace. Run CLI with --verbose flag for more details. Command line invocation: /Applications/Xcode.app/Contents/Developer/usr/bin/xcodebuild -workspace taroDemo.xcworkspace -configuration Debug -scheme taroDemo -destination id=965425FF-ABC6-492C-B456-28CFAC0CF6EA

note: Using new build system note: Building targets in parallel note: Planning build note: Using build description from disk error: /Users/apple/docker/wwwroot/Taro-Mortgage-Calculator/ios/Pods/Target Support Files/Pods-taroDemo/Pods-taroDemo.debug.xcconfig: unable to open file (in target "taroDemo" in project "taroDemo") (in target 'taroDemo' from project 'taroDemo') error: /Users/apple/docker/wwwroot/Taro-Mortgage-Calculator/ios/Pods/Target Support Files/Pods-taroDemo/Pods-taroDemo.debug.xcconfig: unable to open file (in target "taroDemo" in project "taroDemo") (in target 'taroDemo' from project 'taroDemo') error: /Users/apple/docker/wwwroot/Taro-Mortgage-Calculator/ios/Pods/Target Support Files/Pods-taroDemo/Pods-taroDemo.debug.xcconfig: unable to open file (in target "taroDemo" in project "taroDemo") (in target 'taroDemo' from project 'taroDemo') error: /Users/apple/docker/wwwroot/Taro-Mortgage-Calculator/ios/Pods/Target Support Files/Pods-taroDemo/Pods-taroDemo.debug.xcconfig: unable to open file (in target "taroDemo" in project "taroDemo") (in target 'taroDemo' from project 'taroDemo') warning: Capabilities for Signing & Capabilities may not function correctly because its entitlements use a placeholder team ID. To resolve this, select a development team in the taroDemo editor. (in target 'taroDemo' from project 'taroDemo')

BUILD FAILED

zhiqingchen commented 3 years ago

consider building your app with Xcode.app, by opening taroDemo.xcworkspace.

BinZhiZhu commented 3 years ago

consider building your app with Xcode.app, by opening taroDemo.xcworkspace.

image

我现在差不多跑起来了 = = ，日志报错：

bundle(http://localhost:8081/rn_temp/index.bundle?platform=ios&dev=true&minify=false) with error:(Please access /index.bundle for entry bundling. (null))

但是我实际是直接访问 http://localhost:8081/index.bundle?platform=ios&dev=true 构建 js bundle的，是一定要求rn_temp目录吗？怎样可以更改目录配置？日志提示：

21-03-21 12:42:19.481 [info][tid:main][RCTCxxBridge.mm:213] Initializing <RCTCxxBridge: 0x7fa9614168f0> (parent: <RCTBridge: 0x6000009d0460>, executor: (null))
2021-03-21 12:42:19.546 [info][tid:main][RCTRootView.m:293] Running application taroDemo ({
    initialProps =     {
    };
    rootTag = 1;
})
2021-03-21 12:42:19.559 [error][tid:com.apple.NSURLSession-delegate][RCTCxxBridge.mm:414] Failed to load bundle(http://localhost:8081/rn_temp/index.bundle?platform=ios&dev=true&minify=false) with error:(Please access /index.bundle for entry bundling. (null))

@zhiqingchen

BinZhiZhu commented 3 years ago

consider building your app with Xcode.app, by opening taroDemo.xcworkspace.

image

我现在差不多跑起来了 = = ，日志报错：

bundle(http://localhost:8081/rn_temp/index.bundle?platform=ios&dev=true&minify=false) with error:(Please access /index.bundle for entry bundling. (null))

但是我实际是直接访问 http://localhost:8081/index.bundle?platform=ios&dev=true 构建 js bundle的，是一定要求rn_temp目录吗？怎样可以更改目录配置？日志提示：

21-03-21 12:42:19.481 [info][tid:main][RCTCxxBridge.mm:213] Initializing <RCTCxxBridge: 0x7fa9614168f0> (parent: <RCTBridge: 0x6000009d0460>, executor: (null))
2021-03-21 12:42:19.546 [info][tid:main][RCTRootView.m:293] Running application taroDemo ({
    initialProps =     {
    };
    rootTag = 1;
})
2021-03-21 12:42:19.559 [error][tid:com.apple.NSURLSession-delegate][RCTCxxBridge.mm:414] Failed to load bundle(http://localhost:8081/rn_temp/index.bundle?platform=ios&dev=true&minify=false) with error:(Please access /index.bundle for entry bundling. (null))

@zhiqingchen

我目前是手动改了 AppDelegate.m 的 jsBundleURLForBundleRoot 路径

zhiqingchen commented 3 years ago

你是不是壳工程用的0.59？

现在不需要rn_temp目录了

BinZhiZhu commented 3 years ago

你是不是壳工程用的0.59？

现在不需要rn_temp目录了

是的 文档那里没更新 我现在已经切到0.63.2分支了

BinZhiZhu commented 3 years ago

image

踩坑跑起来了

zhiqingchen commented 3 years ago

你是不是壳工程用的0.59？ 现在不需要rn_temp目录了

是的 文档那里没更新 我现在已经切到0.63.2分支了

指的是那一份文档