想问下官方文档中的示例，是如何在浏览器上运行的？

[changpohouxue]

在用taro开发项目，编译到rn和h5平台，看到官方demo中部分组件是可以在浏览器中运行的，比如：https://24jieqi.github.io/react-native-xiaoshu/~demos/src-button-demo-type?locale=zh-CN。

想问下我应该怎么配置，可以在h5平台使用这些组件呢？

[onlyling]

使用 react-native-web 这个库，本项目在 .dumirc.ts 中配置了别名。

react-native-web 目前并不能百分百适配，部分组件或 API 在 Web 端并没有支持。

[changpohouxue]

使用 react-native-web 这个库，本项目在 .dumirc.ts 中配置了别名。

react-native-web 目前并不能百分百适配，部分组件或 API 在 Web 端并没有支持。

非常感谢您的回答，我们不需要百分百适配，只需要基础的button这些组件，我尝试按照react-native-web官网的步骤配置了，在h5平台使用xiaoshu组件库报错，但是在h5平台引用react-native的View、Text组件可以被正常转换。 可以请教下您想在h5平台使用xiaoshu的话需要配置哪些吗？这个问题应该可以帮助很多使用者。

webpack alias配置

 alias: {
   'react-native$': 'react-native-web'
 }

babel.config.js配置

 plugins: [
    ["module-resolver", {
      "alias": {
        "^react-native$": "react-native-web"
      }
    }]
  ]

另外也按照xiaoshu的.dumirc.ts 配置尝试了一下，与上面报错一致:

babel.config.js配置

presets: ['module:@react-native/babel-preset']

.umi-patch/react-native.js

export * from 'react-native-web'

export const InputAccessoryView = () => {}

webpack alias配置

'react-native$': path.resolve(__dirname, "..", '.umi-patch/react-native.js'),

报错信息

Module parse failed: Unexpected token (15:12)
node_modules/react-native/Libraries/Image/resolveAssetSource.js
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| 'use strict';
| 
> import type {ResolvedAssetSource} from './AssetSourceResolver';
| 
| const AssetSourceResolver = require('./AssetSourceResolver');

[onlyling]

可以参考xiaoshu-web-demo这个项目。

[changpohouxue]

可以参考xiaoshu-web-demo这个项目。 好的，谢谢！