NPM import tutorial

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 crypto-js NPM package as an example.

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

Steps to import NPM packages

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 the ClearBlade console, create a dummy library named CryptoJS.

   • The transpiled NPM package will replace this placeholder library.

3. Pull the system:

   • Pull the system into your local workspace using:

     CODE

     cb-cli pull -library CryptoJS

4. Open the workspace in IDE:

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

5. Initialize cb-dev-kit:

   • In the same local workspace folder, run:

     CODE

     cb-dev-kit init

6. Install the node module:

   • Install the crypto-js module with the following command:

     CODE

     npm i --save crypto-js

7. Create transpiled library:

   • Run the following command to create the transpiled library:

     CODE

     cb-dev-kit create -l CryptoJS -t ts

8. Locate the new folder:

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

9. Modify the JavaScript file:

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

     CODE

     import crypto from 'crypto-js'; 
     global.crypto = crypto;

10. Build the library:

    • Run the build command:

      CODE

      npm run build:library -library=CryptoJS

11. Push to ClearBlade system:

    • Push the library to the ClearBlade system with:

      CODE

      cb-cli push -library CryptoJS

    • 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.

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