Skip to main content

Get started

Frontend Dev Environment Setup​

caution

Make sure you have at least v20 of Node.js. If not, visit the official Node.js website and install the "Recommended for most users" version.

Step 1: Check Artifactory Access​

Before proceeding, please verify whether you have access to our Artifactory repository.

Open the following link in your browser:

https://artifactory.stargate.toyota/ui/repos/tree/General/wcm-wig-lab-npm-local

  • If you can access the page, follow Path A: Artifactory Access
  • If you cannot access the page, follow Path B: No Artifactory Access

Path A: Artifactory Access​

If you have access to Artifactory, follow the steps below to install the MiniApp SDK.

1. Configure npm to use Artifactory​

Inside your MiniApp directory, open your terminal and run:

echo @wcm:registry=https://artifactory.stargate.toyota/artifactory/api/npm/wcm-wig-lab-npm-local/ >> .npmrc

2. Login to Artifactory​

npm login --registry https://artifactory.stargate.toyota/artifactory/api/npm/wcm-wig-lab-npm-local/

3. Install the MiniApp SDK​

npm install @wcm/mini-app-sdk@latest \
  --registry https://artifactory.stargate.toyota/artifactory/api/npm/wcm-wig-lab-npm-local/
caution

If you encounter access or authentication errors during any of the above steps, please reach out to us on Woven City App Chat feature through the MiniApp Explorer Project for assistance.

Path B: No Artifactory Access​

Not all users have access to Artifactory, and the MiniApp SDK is not published on npmjs.

If you do not have Artifactory access:

  1. Join the MiniApp Explorer Project. (direct deeplink: wovenapp://projects/13280fd6-be46-4414-a058-32e636da5435)

  2. Open the chat room with this project and let us know:

    • You do not have Artifactory access
    • You need the MiniApp SDK package

Our team will:

  • Provide the SDK package to you directly (.tgz package file for manual installation)
  • Guide you through the installation and setup process step by step

Manual Installation via TGZ File​

1. Obtain the SDK Package​

You'll receive a file named wcm-mini-app-sdk-x.x.x.tgz.

2. Place the SDK package in your project​

Create a libs directory in your project and place the SDK package there:

your-project/
├── libs/
│   └── wcm-mini-app-sdk-x.x.x.tgz
├── src/
└── package.json

3. Install the package:​

npm install ./libs/wcm-mini-app-sdk-x.x.x.tgz

Or add it to your package.json and then run npm install:

{
  "dependencies": {
    "@wcm/mini-app-sdk": "file:./libs/wcm-mini-app-sdk-x.x.x.tgz"
  }
}

4. TypeScript Configuration (Required)​

If you're using TypeScript, update your tsconfig.json to support modern module resolution:

{
  "compilerOptions": {
    "module": "preserve",
    "moduleResolution": "bundler",
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true
  }
}

5. Troubleshooting​

Module Resolution Errors​

If you see errors like Cannot find module '@wcm/mini-app-sdk/auth':

  1. Check TypeScript config: Ensure you have "moduleResolution": "bundler" in your tsconfig.json
  2. Verify installation: Check that the package exists in node_modules/@wcm/mini-app-sdk/
  3. Restart TypeScript server: In VS Code, use Cmd/Ctrl + Shift + P → "TypeScript: Restart TS Server"
Build Errors​
  • Make sure you're using Node.js >= 20
  • Clear node_modules and reinstall: rm -rf node_modules package-lock.json && npm install

6. Version Updates​

When a new SDK version is released:

  1. Replace the old .tgz file with the new one
  2. Update the version in your package.json if using file path reference
  3. Run npm install to update the package
  4. Check the changelog for any breaking changes