Asset Best Practices

This topic applies to

Applies to

SuiteCommerce Web Stores

An asset is an image or font that is not managed by a NetSuite account but still part of a theme or extension. An example of an asset is a carousel image, an icon, or a new font. This can be either a pre-existing asset or one that you introduce as part of a new theme.

When you run the gulp theme:fetch command:

  • Assets for the active theme download to your Workspace/<THEME_DIRECTORY>/assets folder. This is the location where you manage all of your assets (new and pre-existing).

  • Assets for any active extensions download to your Workspace/Extras/Extensions/<EXTENSION_DIRECTORY>/assets folder. Do not move, delete, edit, or add files in this location.

When you activate your theme, all assets are placed in specific locations in your NetSuite File Cabinet based on parameters you specify when you deployed your theme (vendor name, theme name, and theme version). Later, when you activate a newer version of the same theme, your assets are now located in a different location in your File Cabinet. Your code must adapt to the change in the path. If you use absolute paths, the links to these assets will break.

Important

Do not use absolute paths when referring to assets in your code customzations and overrides. Asset files are managed in different locations in NetSuite based on the theme’s vendor, extension name, version, etc. As a best practice, always use the HTML and Sass helpers when referencing assets to ensure that you maintain dynamic paths without unnecessary code changes.


SuiteCommerce provides a few HTML Helpers and Sass Helpers to maintain dynamic paths to your assets, regardless of the vendor, theme, version, etc.

Example:

Using the theme development tools, you deploy a new theme (MyTheme1, Version: 1.0.0). You then activate that theme for a specific site and domain. The compiler places all assets in your NetSuite File Cabinet. The exact location is specific to the SSP Application, vendor, extension, and version that you specified when you deployed your theme.

This location might be similar to the following:

Later, you decide to update your theme, giving it a new version, 2.0.0. When you activate your latest version, the compiler places all assets into a new location:

Related Topics