Resolving relative paths with an alias in React-Native

Viewed 1404

I'm developing my first React-Native app and I'm trying to set up some kind of aliases for local path, to avoid complicated dependencies such as

import {module} from "../../../other/module/"

I'm essentially looking for something similar to Webpack's resolve option.

The solutions I've found online don't seem to work with the latest version of react-native, including using babel-plugin-module-resolver. (I'm developing a web version that uses react-native-web, the plugin worked for that one but not for the iOS simulator, and it eventually broke on the web version too, I'm not sure why).

My gut feeling is that there must be a way of configuring the metro-bundler, but so far I'm not finding any documentation about that.

What are your solutions for this? Or do you just use relative paths?

1 Answers

You can create a file named package.json in each folder that you want to make alias, and inside this file write the name of alias like below(for example inside folder 'other'):

{
    "name": "other"
}

now you can import everything inside other with other alias from anywhere within your project

import {module} from "other/module/"
Related