Page Comparison

To effectively manage ClearBlade libraries, you will use the ClearBlade Command Line Tool and the cb-dev-kit tool for local development and transpiling NPM packages. Below is a step-by-step guide to achieve this, using the cryptomoment-jstimezone NPM package as an example. You can change the instructions for other NPMs accordingly.

Prerequisites

1. ClearBlade Command Line Tool (cb-cli):

   • Have the latest version installed.

   • GitHub Repository: ClearBlade/cb-cli

2. cb-dev-kit:

   • Have the latest version installed.

   • GitHub Repository: ClearBlade/cb-dev-kit

...

1. Initialize ClearBlade workspace:

   • Choose a folder on your local machine, either blank or a Git/source-control workspace.

   • Run cb-cli init in the chosen folder.

   • Follow the initialization steps, referring to the ClearBlade system where the transpiled code will run.

2. Create a dummy library:

   • In Use the ClearBlade console , to create a dummy library named CryptoJS MomentTimezonein the system.

     Image Added

   • The transpiled NPM package will replace this placeholder library.
     

3. Pull the systemlibrary:

   • Pull the system library into your local workspace using:

     Code Block
     cb-cli pull -library CryptoJSMomentTimezone

4. Open the workspace in IDE:

   • Open the local workspace in your preferred IDE (e.g., Visual Studio Code).

     Image Added

5. Initialize cb-dev-kit:

   • In the same local workspace folder, run:

     Code Block
     cb-dev-kit init

6. Install the node module:

   • Install the cryptomoment-jstimezone NPM module with the following command:

     Code Block
     npm i --save cryptomoment-jstimezone

7. Create transpiled library:

   • Run the following command to create the transpiled library:

     Code Block
     cb-dev-kit create -l CryptoJSMomentTimezone -t ts

     NOTE: -t means type and can be ts for TypeScript or js for JavaScript.
     
     You may see component name undefined returned to your terminal. Ignore this.
     

8. Locate the new folder:

   • After successful execution, a new folder will appear in the src directory.
     

9. Modify the JavaScript or TypeScript file:

   • Look at the NPM documentation to find the main object to import. For moment-timezone it is moment.
     

     Image Added

   • In the new JS or TS file within the src folder, add the following lines at the top and delete any other lines:

     Code Block
     import cryptomoment from 'cryptomoment-jstimezone'; global.cryptomoment = cryptomoment;

10. Build the library:

    • Run the build command:

      Code Block
      npm run build:library -library=CryptoJSMomentTimezone

11. Push to ClearBlade system:

    • Push the library to the ClearBlade system with:

      Code Block
      cb-cli push -library CryptoJSMomentTimezone

    • This will upload the library, making it available in the ClearBlade system. You can use the provided test service to see how to call functions from the library.

    • Create a test code-service in the system to test the library. Make sure to add the library as a dependency.
      
      For example:

      Code Block

      function test_moment_timezone(req,resp){ // These are parameters passed into the code service // var params = req.params; // var moment = moment_timezone_lib().moment_timezone(); var june = moment("2014-06-01T12:00:00Z"); log(june.tz('America/Los_Angeles').format('ha z')); // 5am PDT log(june.tz('America/New_York').format('ha z')); // 8am EDT log(june.tz('Asia/Tokyo').format('ha z')); // 9pm JST log(june.tz('Australia/Sydney').format('ha z')); // 10pm EST var dec = moment("2014-12-01T12:00:00Z"); log(dec.tz('America/Los_Angeles').format('ha z')); // 4am PST log(dec.tz('America/New_York').format('ha z')); // 7am EST log(dec.tz('Asia/Tokyo').format('ha z')); // 9pm JST log(dec.tz('Australia/Sydney').format('ha z')); // 11pm EST resp.success("Done"); }

      Image Added

By following these steps, developers can efficiently import and manage NPM packages as ClearBlade libraries, ensuring seamless integration into their ClearBlade projects.