MCPInstall

dx-migrate-js-to-ts-sdk

Migrate Contentstack Delivery SDK code from JavaScript to TypeScript. Rewrite setup, initialization, Stack, Entries, Assets, Query, pagination, cache, utils, taxonomy, and image transform usage while preserving behavior and calling out TypeScript-specific differences. Use when a user wants to migrate Contentstack Delivery SDK code from JavaScript to TypeScript.

Installs
83
Last 24h
—
Trending rank
—
Security
Not audited

Install

Works with every agent the skills CLI supports.

npx skills add https://github.com/contentstack/contentstack-agent-skills --skill dx-migrate-js-to-ts-sdk
  1. 01

    Install

    Run the command in your project. The CLI asks which agents to install for.

  2. 02

    Describe the task

    Ask your agent for something this skill covers. It loads dx-migrate-js-to-ts-sdk automatically when relevant.

  3. 03

    Review the result

    The agent follows the SKILL.md steps, scripts and references bundled with the skill.

SKILL.md

The instructions your agent reads when the skill is triggered.

dx-migrate-js-to-ts-sdk

Description

Migrate Contentstack Delivery SDK code from JavaScript to TypeScript. Rewrite setup, initialization, Stack, Entries, Assets, Query, pagination, cache, utils, taxonomy, and image transform usage while preserving behavior and calling out TypeScript-specific differences.

When to Use

Use when a user wants to migrate Contentstack Delivery SDK code from JavaScript to TypeScript. Use when comparing JavaScript and TypeScript SDK APIs for Stack, Entries, Assets, Query, pagination, cache, utils, taxonomy, or image transforms. Use when a user needs a migration-ready rewrite, a side-by-side comparison, or a concise list of breaking changes and limitations.

User Problem

The user needs to move existing Contentstack Delivery SDK code from JavaScript to TypeScript without losing functionality. They need the API differences, required packages, TypeScript-specific patterns, and unsupported JavaScript behavior translated clearly into working code.

Success Criteria

Identifies the correct JavaScript-to-TypeScript SDK equivalents. Rewrites code into valid TypeScript SDK usage when source code is provided. Calls out required installs, initialization changes, and TypeScript-specific helper usage. Highlights limitations and unsupported patterns that may require redesign. Produces migration guidance and examples that are directly usable in code.

Expected Inputs

  • Existing JavaScript SDK code or snippets
  • Target runtime context, such as Node.js or React Native
  • Specific SDK areas involved, such as Stack, Entries, Assets, Query, caching, utils, taxonomy, or image transforms
  • Whether the user wants explanation, migration steps, or rewritten TypeScript code

Expected Outputs

  • Migration summary
  • API mapping notes
  • Rewritten TypeScript code examples
  • Warnings about limitations or unsupported features
  • Optional side-by-side JavaScript and TypeScript comparisons

Example User Requests

  • Migrate this Contentstack JavaScript SDK code to TypeScript.
  • Rewrite this Stack, Entry, and Query usage for the TypeScript Delivery SDK.
  • Show me the TypeScript equivalent for this JavaScript Contentstack snippet.
  • What changes do I need when moving from contentstack to @contentstack/delivery-sdk?
  • What are the limitations when migrating to the TypeScript Delivery SDK?
  • How do I rewrite cache policy usage for the TypeScript Delivery SDK?
  • How do I migrate utils-based HTML rendering from JavaScript to TypeScript?
  • Convert this taxonomy query from the JavaScript SDK to TypeScript.

Workflow Summary

Identify the SDK area and current JavaScript pattern. Map the JavaScript API to the TypeScript equivalent. Adjust package installs, imports, and initialization. Rewrite code with TypeScript types and SDK methods. Call out limitations, cache requirements, utils changes, and unsupported query patterns. Provide a concise migration summary and examples.

Instructions

Scope

Help users migrate Contentstack Delivery SDK code from JavaScript to TypeScript. Rewrite code when requested or when source code is provided. Focus on accurate API mapping, install steps, initialization, typing, and feature differences.

Migration rules

Prefer TypeScript SDK equivalents from @contentstack/delivery-sdk. Preserve behavior where possible. Flag unsupported JavaScript patterns, TypeScript-only additions, and required package changes. Do not invent SDK methods not present in the reference docs.

Key mappings

Use contentstack.stack(...) instead of contentstack.Stack(...). Use stack.contentType(...), entry(...), asset(...), query(), fetch(), find(), paginate(), next(), previous(), locale(), includeReference(), includeEmbeddedItems(), includeContentType(), includeCount(), and taxonomy methods as appropriate. Note that cache support requires @contentstack/persistance-plugin and utils require @contentstack/utils.

Limitations

Call out the 8KB URL limit, lack of multiple content type references in a single query, and lack of direct Global Field schema querying. Suggest include_global_field_schema for content type details when relevant. Mention assetFields support is region-limited to NA.

Examples

Include at least one migration example when the user asks for help. Prefer side-by-side snippets or before/after code when useful. If the user provides source code, return a rewritten TypeScript version plus a short change summary. Include examples for cache, utils, query, taxonomy, and pagination when relevant.

Output Format

Be concise and migration-oriented. Use code blocks for code examples. When helpful, show JavaScript and TypeScript side by side. Explicitly call out unsupported or changed behavior. When source code is provided, include a rewritten TypeScript version. Do not invent SDK methods not present in the reference docs.

Tooling Notes

No tools are required by default. If code is provided, focus on transformation and explanation only. If caching is involved, mention the persistence plugin requirement. If utils are involved, mention the separate @contentstack/utils install. If the user asks about image transforms, use the documented ImageTransform methods only.

Security

Defaults

  • Never expose deployment tokens or environment secrets.
  • Validate deployment targets before triggering.
  • Require confirmation for production deployments.
  • Never auto-deploy to production without review.

Destructive Actions

Do not perform destructive actions. If a request would delete, overwrite, or publish content, require explicit confirmation and explain the impact first.

Secrets

Never request, reveal, or echo delivery tokens, API keys, or other secrets. If code samples include secrets, replace them with placeholders.

Environment Variables

When environment variables are needed, use placeholder names and explain expected values. Never print real values or infer secrets from context.

Product Context

    • Product: Developer Experience
    • Description: Developer experience tooling
    • Product safety rules: - Never expose deployment tokens or environment secrets.
  • Validate deployment targets before triggering.
  • Require confirmation for production deployments.
  • Never auto-deploy to production without review.

Examples

Basic SDK installation migration (few shot *)

User: How do I migrate from the JavaScript Contentstack Delivery SDK to TypeScript?

Assistant: Install @contentstack/delivery-sdk@latest, switch imports to @contentstack/delivery-sdk, and update initialization from contentstack.Stack(...) to contentstack.stack(...). If you need caching, install @contentstack/persistance-plugin@latest. If you need utils, install @contentstack/utils@latest.

Shows the core package and import changes.

Stack sync migration (few shot *)

User: Convert this sync code to TypeScript: Stack.sync({ init: true, locale: 'en-us' })

Assistant: Use the TypeScript SDK stack instance and call stack.sync({ locale: 'en-us' }). The TypeScript guide does not use init: true for initial sync.

Highlights the sync API difference.

Entry fetch migration (few shot *)

User: What's the TypeScript equivalent of Stack.ContentType('blog').Entry('uid').only('title').toJSON().fetch()?

Assistant: Use stack.contentType('blog').entry('uid').only('title').fetch() in the TypeScript SDK. If you want typed results, add a generic or interface such as fetch<BlogEntry>().

Shows the entry API mapping and typing pattern.

Query rewrite with reference and sorting (few shot)

User: Rewrite this JavaScript query for TypeScript: Stack.ContentType('blog').Query().where('title', 'welcome').includeCount().toJSON().find()

Assistant: Use stack.contentType('blog').entry().query().where('title', 'welcome').includeCount().find() in the TypeScript SDK. If you need referenced content too, add includeReference('field_uid') before find().

Demonstrates query rewriting and a TypeScript query method.

Cache policy migration (few shot)

User: Do I need anything extra for cache support in the TypeScript SDK?

Assistant: Yes. Install @contentstack/persistance-plugin@latest and pass cacheOptions with a persistence store when using cache policies other than Policy.IGNORE_CACHE.

Captures the cache plugin requirement.

Utils library migration (few shot)

User: How do I migrate Contentstack Utils usage to TypeScript?

Assistant: Install @contentstack/utils@latest and import it separately, for example: import * as Utils from '@contentstack/utils'. Then call Utils.jsonToHTML(...) instead of contentstack.Utils.jsonToHTML(...).

Shows the separate utils package requirement.

Taxonomy query migration (few shot)

User: Convert this taxonomy filter to TypeScript: Stack.ContentType('article').Query().where('taxonomies.topics', termUid).find()

Assistant: Use stack.contentType('article').entry().query() and apply the taxonomy helper that matches your filter, such as equalAndBelow('taxonomies.topics', termUid, level). If you need taxonomy records directly, use stack.taxonomy('taxonomy_uid').find() or .term('term_uid').fetch().

Covers taxonomy-aware query migration.

Limitations check (edge case)

User: Can I query multiple content types and global field schemas the same way in TypeScript as in JavaScript?

Assistant: No. The TypeScript Delivery SDK does not support multiple content type references in a single query, and it does not directly support querying Global Field schemas. For content type details, use include_global_field_schema. Also note the 8KB URL limit.

Uses the documented limitations.

FAQ

What does the dx-migrate-js-to-ts-sdk skill do?

Migrate Contentstack Delivery SDK code from JavaScript to TypeScript. Rewrite setup, initialization, Stack, Entries, Assets, Query, pagination, cache, utils, taxonomy, and image transform usage while preserving behavior and calling out TypeScript-specific differences. Use when a user wants to migrate Contentstack Delivery SDK code from JavaScript to TypeScript.

How do I install dx-migrate-js-to-ts-sdk?

Run npx skills add https://github.com/contentstack/contentstack-agent-skills --skill dx-migrate-js-to-ts-sdk in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/dx-migrate-js-to-ts-sdk/ (personal) or .claude/skills/dx-migrate-js-to-ts-sdk/ (project).

Which AI agents can use dx-migrate-js-to-ts-sdk?

Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.

Is dx-migrate-js-to-ts-sdk safe to install?

No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.

Who maintains dx-migrate-js-to-ts-sdk?

It is published by contentstack in contentstack/contentstack-agent-skills, and it is an official skill from the maker of the technology it covers. It has 83 recorded installs.

More from contentstack/contentstack-agent-skills

View all →

cms-entries

contentstack/contentstack-agent-skills

Advise developers on querying, localizing, versioning, publishing, and structuring Contentstack entries for efficient delivery. Focus on CDA usage, reference expansion, pagination, bulk operations, and Sync API patterns. Use when developers ask about fetching entries, building CDA queries, handling localization, publishing workflows, versioning behavior, bulk operations, or entry-related performance issues.

OfficialBackend & APIs99 installs

cms-environments-publishing

contentstack/contentstack-agent-skills

Advise developers on configuring environments, publishing content, using delivery and preview tokens, leveraging the Sync API, and understanding CDN and publish queue behavior in Contentstack. Use when developers ask about environment setup, publishing behavior, delivery or preview tokens, the Sync API, scheduling, or CDN and caching configuration in Contentstack.

OfficialBackend & APIs98 installs

cms-assets

contentstack/contentstack-agent-skills

Advise developers on organizing, delivering, and transforming assets in Contentstack. Cover folder structure, Image Delivery API transformations, publishing lifecycle, CDN behavior, and common limits. Use when developers ask about uploading, organizing, delivering, transforming, publishing, or troubleshooting images and other media files in a stack's asset library. For the standalone Assets DAM (spaces, workspaces, duplicate sets, saved views, visual markups), use asset-management instead. Reading or updating user-defined fields is not supported here; use asset-management and the Assets API.

OfficialBackend & APIs98 installs

cms-data-modeling-best-practices

contentstack/contentstack-agent-skills

Guide developers to model content in Contentstack using the simplest reusable structure. The skill explains when to use content types, references, global fields, groups, modular blocks, JSON RTE, taxonomy, and tags, and helps avoid over-modeling, deep reference chains, and channel-specific schema sprawl. Use when designing, reviewing, or refactoring Contentstack content models before creating or changing schemas.

OfficialCode Quality & Workflow98 installs

cms-taxonomy

contentstack/contentstack-agent-skills

Advise developers on using Contentstack Taxonomy for structured, hierarchical content classification and delivery-side filtering. Covers taxonomy vs tags, labels, and references; hierarchy design; CDA query operators; localization; and import/export. Use when developers need help classifying content, designing category hierarchies, choosing between taxonomy and other classification approaches, or querying entries by category on the delivery side.

OfficialAI & Agents94 installs

cms-webhooks

contentstack/contentstack-agent-skills

Advise developers on configuring and consuming Contentstack webhooks for real-time event notifications. Cover event channels, payload structure, signature verification, retry behavior, release-triggered webhook storms, and reliable receiver design. Use when developers need help setting up webhooks, choosing event channels, handling webhook payloads, verifying signatures, debugging delivery issues, or integrating Contentstack with external systems such as site rebuilds, search indexes, Slack, or CI/CD.

OfficialBackend & APIs93 installs

Popular code quality & workflow skills

View category →

grill-me

mattpocock/skills

A relentless interview to sharpen a plan or design.

Scan a codebase for deepening opportunities, present them as a visual HTML report, then grill through whichever one you pick.

handoff

mattpocock/skills

Compact the current conversation into a handoff document for another agent to pick up.

domain-modeling

mattpocock/skills

Build and sharpen a project's domain model. Use when discussing codebase terminology, writing or editing a GLOSSARY.md, or recording or editing an ADR.

codebase-design

mattpocock/skills

Shared vocabulary for designing deep modules. Use when the user wants to design or improve a module's interface, find deepening opportunities, decide where a seam goes, make code more testable or AI-navigable, or when another skill needs the deep-module vocabulary.

diagnosing-bugs

mattpocock/skills

Diagnosis loop for hard bugs and performance regressions. Use when the user says "diagnose"/"debug this", or reports something broken/throwing/failing/slow.