Code Sync Framer plugin

This open-source plugin streamlines your development workflow by connecting your local codebase with Framer projects. It automatically detects file changes and handles transformations, making it easier to work with custom components and folder structures.

Key features and benefits:

• Smart re-uploading: only modified files get updated, so you’re not waiting around for unchanged components to sync again
• Flexible upload modes: switch between uploading entire folders or picking specific .tsx files, with drag and drop support for quick transfers
• Environment management: set up development, staging, and production variables in an Env.tsx file and switch between them with one click
• Advanced configuration options: configure imports, ignore specific files, and customise the plugin to match your workflow needs
• Automatic file tracking: the plugin monitors changes in your codebase so you can iterate quickly without manual oversight
• Team synchronisation: environment selections are saved per project, keeping everyone on the same page

Code Sync is particularly useful if you’re working with custom components or managing multiple environments in your Framer projects. It removes the tedious parts of file management whilst giving you the flexibility to work with your preferred development setup.