Fetching Active Themes for SuiteCommerce Development

When you run the gulp theme:fetch command, the theme developer tools perform several crucial functions to streamline your theme development on SuiteCommerce.

What Happens When You Fetch an Active Theme?

1. Workspace Directory Creation: The developer tools create the Workspace directory in your theme development directory. If the Workspace directory already exists, its contents will be cleared before downloading the new files. This action overwrites any files already present in your local workspace.
2. Theme File Downloading: All theme-related HTML and Sass files for the active theme are downloaded and organized in your workspace, sorted by module within a dedicated directory for the theme. For instance, files will be located under Workspace/<THEME_DIRECTORY>/Modules.
3. Asset Management: All theme-related assets are placed into Workspace/<THEME_DIRECTORY>/assets.
4. Skin Presets: Theme-related skin preset files are downloaded to Workspace/<THEME_DIRECTORY>/Skins.
5. Overrides Handling: If the theme includes any previously deployed overrides, those are downloaded into ../Workspace/<THEME_DIRECTORY>/Overrides.
6. File Validation: The developer tools validate that all files listed in the theme's manifest.json are downloaded correctly. Any missing files will be identified, prompting you to rerun the gulp theme:fetch command.

Active Extensions

If the chosen domain includes any active extensions, the developer tools will:

• Download all extension-related HTML and Sass files and organize them by module in directories named according to each active extension (Workspace/Extras/Extensions/<EXTENSION_DIRECTORY>/Modules).
• Download extension-related assets into ../Workspace/Extras/Extensions/<EXTENSION_DIRECTORY>/assets.

When fetching an active theme, you acquire the foundational HTML, Sass, and asset files necessary for your theme development. While a published theme is protected by copyright—meaning you can't overwrite its files—you can use it as a base to create your own unique theme.

Custom Development

You have the option to override the HTML and Sass for the active extensions with your modifications or add new assets. Be aware that while these declarations affect your domain once activated, they do not overwrite the published extension's code.

Example Structure

Consider that your domain has an active theme named SuiteCommerceBaseTheme and an extension called PublishedExtension1. When you run the gulp theme:fetch command, your Workspace directory should resemble:

1Workspace/  
2      Extras/  
3         Extensions/  
4            ACME/  
5               PublishedExtension1/  
6                  assets/  
7                  Modules/  
8                  manifest.json  
9               application_manifest.json  
10      SuiteCommerceBaseTheme/  
11         assets/  
12         Modules/  
13         Overrides/  
14         Skins/  
15         manifest.json  

File Types and Locations

This breakdown helps ensure your theme development environment is efficiently set up following the execution of the gulp theme:fetch command.