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

Question

I need to use react native web maps in react native project , i'm using expo and need to alias package in my webpack.config.js i want to use both ios/web version for my map.

I m fairly new to programming

link to library i m using

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

my webpack.config.js is

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;
    };

user2255297 · Accepted Answer · 2022-02-25 13:23:00Z

5

You probably found out already, but for others who are looking for the solution:

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;
};

This will create an alias for react-native and react-native-maps. So when we are on web, the modules react-native-web and react-native-web-maps will be used instead of the original ones.

If the page remains blank, temporarily remove the MapView element from your code and see if the other elements will appear.

answered Feb 25, 2022 at 13:23

user2255297

2181 gold badge4 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

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

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related