The assets builder manages assets within VTEX IO apps. It does this by collecting all asset paths used and uploading them to the File Manager service.

The File Manager service manages store files and their respective URLs, translating asset paths and exporting immutable URLs for proper rendering of block assets.

For more information about using this builder in a Store Theme app, see Using the assets builder.

An app that uses the assets builder has a folder named \assets in its root directory. The directory structure may vary depending on specific project settings.

You can add any image extension, such as .jpeg, .png, and .gif, as well as store font files (.ttfor .woff) to later customize store typography.

Assets can be added directly to the /assets folder, or for better organization, subfolders can be created within it, as illustrated below:

To use the assets builder in your app, follow these steps:

1. Add the assets builder to your app’s builder list in the manifest.json file, as shown below:

   
   

   _10

   "builders": {

   _10

   "assets": "0.x"

   _10

   }

   
   

2. In the root directory of your app, create an /assets folder to manage store assets.

3. Add the asset files to the /assets folder. Add subfolders to organize the files as needed.

4. To use the stored assets within your app, use the asset path as the value of a given parameter. Note that if you have structured subfolders within the assets folder, you need to include the folder hierarchy in the asset path. For example: assets/fonts/{FileName}.woff.

As an example, check the folder structure of this builder in the B2B Theme app:

• The fonts folder contains .woff files, which are web fonts.
• The icons folder holds .svg files, which may be icons, logos, graphics, and other vector images.