反应本机安卓应用程序来反应本机网络应用程序

时间:2020-12-28 07:52:18

标签: reactjs react-native web picker react-native-web

我正在尝试将我的 react-native android 应用程序转换为 react-native web 应用程序。在执行此操作时,我在 @react-native-picker\picker 中遇到错误。

编译失败 ./node_modules/@react-native-picker/picker/js/Picker.web.js SyntaxError: C:\Users\User\Desktop\react-native\TestProject\node_modules@react-native-picker\picker\js\Picker.web.js: 意外令牌 (9:12)

<div class="image-border" >

<div class="image-text-center">HELLO WORLD!!</div>

</div>

我该如何解决这个问题?

1 个答案:

答案 0 :(得分:2)

看起来 Picker.web.js 包含用 Flow 编写的代码,因此您需要确保您的网络项目已启用对 Flow 的支持。


由于您使用的是 Create React App,您需要自定义配置以启用 node_modules 内的包的 Babel:

  1. 安装 customize-crareact-app-rewired
npm install --save-dev customize-cra react-app-rewired 
  1. 按照以下步骤完成 react-app-rewired 的安装:https://github.com/timarney/react-app-rewired#how-to-rewire-your-create-react-app-project

  2. node_modules/@react-native-picker/picker 配置 Babel 包含:

// config-overrides.js

const path = require('path');
const {
    babelInclude,
    override,
} = require('customize-cra');

module.exports = override(
    babelInclude([
        path.resolve('src'),
        path.resolve(__dirname, 'node_modules/@react-native-picker/picker'),
    ]),
);