How to add src folder to React-native and import absolutely?

Question

I am trying to add src directory so that I would have something like

- package.json
- android
- ios
- src
   - foo
     - hello.js
- index.js
- App.js
- node_modules

Then I added

watchFolders: [path.join(__dirname, 'src')],

to metro.config.js

hoping to be able to do import hello from 'foo/hello' from anywhere (for example from App.js)

I also found that you could achieve the absolute import if you add folders under node_modules

- package.json
- android
- ios
- node_modules
   - foo
     - hello.js
- index.js
- App.js

Answer 1

Create a package.json inside the src folder with the following content

{
    "name": "src"
}

Then you can reference other files as such import hello from 'src/foo/hello'

You can also check this video

Answer 2

you need to create an index.js file to the foo folder

index.js

 import hello from './hello.js'

    export{
      hello
    }

where ever you want to import the file to

otherfile.js

import hello from '../../src/foo'