Baseline Extension Creation in SuiteCommerce Development

Creating a baseline extension in SuiteCommerce is a straightforward process involving the use of the gulp extension:create command. This command facilitates the setup needed for developers to begin working on their extensions, incorporating essential assets and configuration files.

What Happens When You Create a Baseline Extension?

When you execute the gulp extension:create command, several key actions take place:

• Workspace Directory: A directory named Workspace is created in your primary development directory if it doesn't already exist.
• Subdirectory for Extension: A subdirectory with your chosen extension name is generated to contain all essential assets and the initial module for development.
• Manifest File: The command creates a manifest.json file that contains all necessary information for compiling resources related to your extension.

Example Directory Structure

To illustrate, if you create an extension called MyCoolExtension with options including a vendor name of Acme and an initial module named MyCoolModule, the resulting directory structure in the Workspace will resemble the following:

1Workspace/
2      MyCoolExtension/
3         assets/
4            fonts/
5            img/
6            services/
7         Modules/
8            MyCoolModule/
9               Configuration/
10               JavaScript/
11               Sass/
12               SuiteScript/
13               SuiteScript2/
14               Templates/
15         manifest.json

For further details about the files in a baseline extension, refer to the documentation on the Anatomy of an Extension.

Starter Files

The developer tools also generate starter files, including Configuration, JavaScript, Sass, SuiteScript, SuiteScript 2, and Templates, designed to help you build a basic "Hello World" extension. When using these starter files, adjustments might be required in specific directories, particularly the JavaScript directory, depending on the SuiteCommerce or SuiteCommerce Advanced version you are targeting.

1. Acme.MyCoolExtension.MyCoolModule.Model.js: Serves as the frontend model for your extension's initial module. For SuiteCommerce or SuiteCommerce Advanced 2020.1 and later, to incorporate SuiteScript 2.0 services, define the getAbsoluteUrl method appropriately.
2. MyCoolModule.Model.View.js: This file represents the view of your extension and is responsible for managing user interface events and data presentation.

SuiteScript 2.0 Services

When creating models in the JavaScript directory, each model will include logic for issuing requests via entry points to backend services. The method getAbsoluteUrl is essential for accurately generating service URLs, especially once the extension is deployed and activated in NetSuite. Here’s how you set it up:

• Parameters for getAbsoluteUrl include:
  • The relative path to the service returned by the getExtensionAssetsPath helper.
  • A boolean parameter that, when set to True, generates an absolute URL for SuiteScript 2.0 services, while False generates a URL for SuiteScript 1.0 services.

Important: The extension developer tools will create one initial frontend model for each module in your extension. If your module has multiple services, additional models need to be created. You can duplicate and rename the initial model, ensuring each new model has the correct getAbsoluteUrl settings.

Code Examples

• SuiteScript 1.0 Service:

//@property {String} urlRoot
     urlRoot: Utils.getAbsoluteUrl(
       getExtensionAssetsPath("services/MyCoolModule.Service.ss")
     );

• SuiteScript 2.0 Service:

1//@property {String} urlRoot
2     urlRoot: Utils.getAbsoluteUrl(
3       getExtensionAssetsPath(
4         "Modules/MyCoolModule/SuiteScript2/MyCoolModule.Service.ss"
5       ),
6       true
7     );