在您的 webpack 配置中为包添加别名：react native web maps ；反应原生地图

Question

我需要在 React Native 项目中使用 React Native Web 地图，我正在使用 expo 并且需要在我的 webpack.config.js 中使用别名包我想为我的地图同时使用 ios/web 版本。

我对编程还很陌生

link 到我正在使用的库

https://www.npmjs.com/package/react-native-web-maps

我的webpack.config.js是

const createExpoWebpackConfigAsync = require('@expo/webpack-config');

    module.exports = async function (env, argv) {
      const config = await createExpoWebpackConfigAsync(env, argv);
      // Customize the config before returning it.
      return config;
    };

Answer 1

您可能已经发现了，但对于正在寻找解决方案的其他人来说：

const createExpoWebpackConfigAsync = require('@expo/webpack-config');

module.exports = async function (env, argv) {
  const config = await createExpoWebpackConfigAsync(env, argv);
  config.resolve.alias['react-native'] = 'react-native-web';
  config.resolve.alias['react-native-maps'] = 'react-native-web-maps';
  return config;
};

这将为 react-native 和 react-native-maps 创建一个别名。所以当我们在网络上时，模块 react-native-web 和 react-native-web-maps 将被使用，而不是原来的。

如果页面仍为空白，请暂时从您的代码中删除 MapView 元素并查看其他元素是否会出现。

在您的 webpack 配置中为包添加别名：react native web maps ；反应原生地图

Alias the package in your webpack config: react native web maps ; react native maps

alias

react-native-maps

expo

webpack.config.js