The image-assets-generator package is a powerful tool designed to streamline the process of reading asset directories and automatically generating JSON files for each folder and nested subfolder. With this package, developers can efficiently organize and access their image assets within their React Native projects.

🏠 Homepage

Prerequisites

• npm >=5.5.0
• node >=9.3.0

Install

• Install

  npm install -g image-assets-generator

or yarn

  yarn global add image-assets-generator

Usage

• Add assets to your react-native.config.js like so:

  ...
  assets: [
      "./src/assets", 
      "./assets",
  ], 

• To generate JSON files for assets, run this command!

  npx image-assets-generator

  or

  bash image-assets-generator

Result

For example, if you have this folder structure, you'll get the following result:

    ├── assets
        ├── general                 
        │   ├── edit.png          
        │   ├── background_banner.jpg         
        │   ├── remove.jpg         
        │   └── timer.png               
        └── ...

index.js

const GeneralAssets = {
  Edit: require('./edit.png'),
  BackgroundBanner: require('./background_banner.jpg'),
  Remove: require('./remove.jpg'),
  Timer: require('./timer.jpg'),
};
export default GeneralAssets;

Folder Structure

    ├── assets
        ├── general                 
        │   ├── index.js          
        │   ├── edit.png          
        │   ├── background_banner.jpg         
        │   ├── remove.jpg         
        │   └── timer.png               
        └── ...

Author

👤 Mahmoud Albelbeisi

• Github: @MahmoudMMB

🤝 Contributing

Contributions, issues and feature requests are welcome!Feel free to check issues page. You can also take a look at the contributing guide.

Show your support

Give a ⭐️ if this project helped you!

📝 License

Copyright © 2024 Mahmoud Albelbeisi. This project is ISC licensed.