framer-upgrade-migration
'Analyze, plan, and execute Framer SDK upgrades with breaking change
Allowed Tools
ReadWriteEditBash(npm:*)Bash(git:*)
Provided by Plugin
framer-pack
Claude Code skill pack for Framer (18 skills)
Installation
This skill is included in the framer-pack plugin:
/plugin install framer-pack@claude-code-plugins-plusClick to copy
Instructions
Framer Upgrade & Migration
Overview
Guide for upgrading Framer plugin SDK, Server API, and migrating between Framer platform versions. Check the Framer Developer Changelog for breaking changes before upgrading.
Instructions
Step 1: Check Current Versions
npm list framer-plugin framer-api framer
npm view framer-plugin version
npm view framer-api version
Step 2: Review Changelog
Visit https://www.framer.com/developers/changelog for breaking changes.
Key migrations:
- Plugin API 3.x: Introduced Managed Collections, Code File APIs
- Server API beta: WebSocket-based programmatic access
- Code Components v2: Updated property control types
Step 3: Upgrade Plugin SDK
git checkout -b upgrade/framer-plugin
npm install framer-plugin@latest
npm run build # Check for type errors
npm test # Run tests
Step 4: Common Migration Patterns
// Plugin API 2.x → 3.x: Collection APIs changed
// BEFORE: framer.createCollection(...)
// AFTER: framer.createManagedCollection(...)
// Code components: ControlType changes
// BEFORE: ControlType.FusedNumber
// AFTER: ControlType.Number (with min/max/step)
// Overrides: import path
// BEFORE: import { Override } from 'framer'
// AFTER: import { Override } from 'framer' (unchanged, but check type shape)
Step 5: Rollback
# Pin to previous version
npm install framer-plugin@3.x.x --save-exact
Resources
Next Steps
For CI integration, see framer-ci-integration.