gpt4 book ai didi

react-native - 如何使用buck构建适用于iOS和Android的React-native应用程序

转载 作者:行者123 更新时间:2023-12-03 13:36:52 25 4
gpt4 key购买 nike

Buck听起来对iOS和Android项目来说都是不错的工具,但是我还没有找到有关如何将其用于本地化项目的信息。

更新

似乎已经对此进行了一些工作,但是可能不建议这样做。

https://github.com/facebook/nuclide/issues/31#issuecomment-164897170
https://github.com/facebook/buck/tree/master/test/com/facebook/buck/js

更新2

产品痛苦链接https://productpains.com/post/react-native/add-buck-as-a-build-option

最佳答案

2017年8月6日更新:

我尝试按照下面的步骤使用Buck将React Native集成到iOS应用中,但是在使用React Native 0.47时遇到了问题。相反,我有一种新的更简单的方法,通过链接到预构建的库,使React Native在iOS上与Buck一起使用。我 fork 了Buck示例项目存储库,并使其与this repo中的React Native一起使用。我还通过运行示例Buck React Native iOS应用程序以及如何集成自己的说明更新了该存储库中的README

请注意,自述文件中记录了此方法的一些问题,在生产应用程序中使用此方法可能会或可能不会造成问题。

该仓库还没有 bundle JS进行生产。

较旧的答案:

我让Buck负责一个iOS项目。这是一项很大的工作,但是可行。一些注意事项:

  • 我手动从node_modules/react-native/React复制文件,然后node_modules/react-native/Libraries(请参见下面的文件夹结构)。
  • 我必须在每个库中添加-wWno-error标志,因为主项目将警告视为错误,并且我不想在Xcode中看到所有这些React Native警告。
  • 您可能必须按照该模式添加更多库。它还有助于查看React Native podspec
  • 可能有机会进行清理,例如reactnative.xcodeproj文件夹中不需要vendor/reactnative(请参见下文)。
  • 可能需要一些工作才能正确 bundle JS进行生产。目前,仅当从服务器(例如Node.js)中获取JS时,该功能才有效。

  • 这是我的 vendor/reactnative/BUCK文件:
    apple_library(
    name = 'ReactNative',
    srcs = glob([
    'React/**/*.m',
    'React/**/*.mm',
    'React/**/*.c',
    'React/**/*.S',
    ]),
    exported_headers = glob([
    'React/**/*.h',
    ]),
    system_frameworks = [
    'JavaScriptCore'
    ],
    exported_linker_flags = [
    '-lc++',
    ],
    compiler_flags = [
    '-Wno-error',
    '-w'
    ],
    visibility = ['PUBLIC'],
    )

    apple_library(
    name = 'RCTWebSocket',
    srcs = glob([
    'Libraries/WebSocket/*.m',
    ]),
    headers = glob([
    'React/**/*.h',
    ]),
    exported_headers = glob([
    'Libraries/WebSocket/*.h',
    ]),
    compiler_flags = [
    '-Wno-error',
    '-w'
    ],
    visibility = ['PUBLIC'],
    deps = [
    ':ReactNative',
    ]
    )

    apple_library(
    name = 'RCTNetwork',
    srcs = glob([
    'Libraries/Network/*.m',
    ]),
    headers = glob([
    'React/**/*.h',
    ]),
    exported_headers = glob([
    'Libraries/Network/*.h',
    ]),
    compiler_flags = [
    '-Wno-error',
    '-w'
    ],
    visibility = ['PUBLIC'],
    deps = [
    ':ReactNative',
    ]
    )

    apple_library(
    name = 'RCTText',
    srcs = glob([
    'Libraries/Text/*.m',
    ]),
    headers = glob([
    'React/**/*.h',
    ]),
    exported_headers = glob([
    'Libraries/Text/*.h',
    ]),
    compiler_flags = [
    '-Wno-error',
    '-w'
    ],
    visibility = ['PUBLIC'],
    deps = [
    ':ReactNative',
    ]
    )

    apple_library(
    name = 'RCTImage',
    srcs = glob([
    'Libraries/Image/*.m',
    ]),
    headers = glob([
    'React/**/*.h',
    'Libraries/Network/*.h'
    ]),
    exported_headers = glob([
    'Libraries/Image/*.h',
    ]),
    compiler_flags = [
    '-Wno-error',
    '-w'
    ],
    visibility = ['PUBLIC'],
    deps = [
    ':ReactNative',
    ':RCTNetwork'
    ]
    )

    这是我的项目中供应商文件夹中的文件夹结构:
    vendor/reactnative
    ├── BUCK
    ├── Libraries
    │   ├── ART
    │   ├── ActionSheetIOS
    │   ├── AdSupport
    │   ├── Animated
    │   ├── AppRegistry
    │   ├── AppState
    │   ├── BatchedBridge
    │   ├── BugReporting
    │   ├── CameraRoll
    │   ├── Components
    │   ├── CustomComponents
    │   ├── DebugComponentHierarchy
    │   ├── Devtools
    │   ├── EventEmitter
    │   ├── Experimental
    │   ├── Fetch
    │   ├── Geolocation
    │   ├── Image
    │   ├── Inspector
    │   ├── Interaction
    │   ├── JavaScriptAppEngine
    │   ├── LayoutAnimation
    │   ├── Linking
    │   ├── LinkingIOS
    │   ├── Modal
    │   ├── NativeAnimation
    │   ├── NavigationExperimental
    │   ├── Network
    │   ├── Promise.js
    │   ├── PushNotificationIOS
    │   ├── QuickPerformanceLogger
    │   ├── RCTTest
    │   ├── RKBackendNode
    │   ├── ReactIOS
    │   ├── ReactNative
    │   ├── Sample
    │   ├── Settings
    │   ├── Storage
    │   ├── StyleSheet
    │   ├── Text
    │   ├── Utilities
    │   ├── Vibration
    │   ├── WebSocket
    │   ├── promiseRejectionIsError.js
    │   ├── react-native
    │   └── vendor
    ├── React
    │   ├── Base
    │   ├── Executors
    │   ├── Layout
    │   ├── Modules
    │   ├── Profiler
    │   └── Views
    └── reactnative.xcodeproj
    ├── project.pbxproj
    └── xcuserdata

    然后在我的主要BUCK文件的 deps中添加:
    '//vendor/reactnative:ReactNative',
    '//vendor/reactnative:RCTWebSocket',
    '//vendor/reactnative:RCTText',
    '//vendor/reactnative:RCTNetwork',
    '//vendor/reactnative:RCTImage'

    关于react-native - 如何使用buck构建适用于iOS和Android的React-native应用程序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34997158/

    25 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com