Framer Upgrade & Migration

Overview

Guide for upgrading Framer SDK versions and handling breaking changes.

Prerequisites

• Current Framer SDK installed
• Git for version control
• Test suite available
• Staging environment

Instructions

Step 1: Check Current Version

npm list @framer/sdk
npm view @framer/sdk version

Step 2: Review Changelog

open https://github.com/framer/sdk/releases

Step 3: Create Upgrade Branch

git checkout -b upgrade/framer-sdk-vX.Y.Z
npm install @framer/sdk@latest
npm test

Step 4: Handle Breaking Changes

Update import statements, configuration, and method signatures as needed.

Output

• Updated SDK version
• Fixed breaking changes
• Passing test suite
• Documented rollback procedure

Error Handling

Examples

Import Changes

// Before (v1.x)
import { Client } from '@framer/sdk';

// After (v2.x)
import { FramerClient } from '@framer/sdk';

Configuration Changes

// Before (v1.x)
const client = new Client({ key: 'xxx' });

// After (v2.x)
const client = new FramerClient({
  apiKey: 'xxx',
});

Rollback Procedure

npm install @framer/sdk@1.x.x --save-exact

Deprecation Handling

// Monitor for deprecation warnings in development
if (process.env.NODE_ENV === 'development') {
  process.on('warning', (warning) => {
    if (warning.name === 'DeprecationWarning') {
      console.warn('[Framer]', warning.message);
      // Log to tracking system for proactive updates
    }
  });
}

// Common deprecation patterns to watch for:
// - Renamed methods: client.oldMethod() -> client.newMethod()
// - Changed parameters: { key: 'x' } -> { apiKey: 'x' }
// - Removed features: Check release notes before upgrading

Resources

• Framer Changelog
• Framer Migration Guide

Next Steps

For CI integration during upgrades, see framer-ci-integration.