Home > OS >  How can I export images path with require() from one index.js file in react naitve?
How can I export images path with require() from one index.js file in react naitve?

Time:11-30

I want to export all images from one file which index.js so that If in future I have to change the path of image then I have to only make changes in one file.

like this:

export {default as avatar} from './avatar.png';
export {default as career} from './PsychoScreenImages/career.jpeg';
export {default as application} from './redeemIcons/application.jpeg';
export {default as featured} from './redeemIcons/featured.jpeg';

But I can't do like this require(avatar) as it requires the only a path. So, How can I export and import images from just one js file?

CodePudding user response:

You can create a file that itself exports the image paths require within it. As shown below -

Just you can name this file imagepaths.js

export default {
  logo: require('./images/logo.png'),
  newLogo: require('./images/logo-new.png')
}

Now import this and use as-

import imagePath from 'imagePath';

return (
    <>
        <Image source={imagePath.logo} />
        <Image source={imagePath.newLogo} />
    </>
)
  • Related