Skip to content
master
Switch branches/tags
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 

README.md

babel-plugin-framer-x

Who is this for?

  • You have components built with Framer X, but want to publish a living styleguide with something like Storybook or Styleguidist.
  • You want to use components built in Framer X directly in a React application.

This plugin removes two things that normally you need to do by-hand:

  • All imported values from framer.
  • All propertyControls class properties.
// Removes this
import { PropertyControls, ControlType } from "framer";

// Removes this
const { PropertyControls, ControlType } = require("framer");

// Removes this
static propertyControls: PropertyControls = {
  text: { type: ControlType.String, title: "Text" },
  color: { type: ControlType.Color, title: "Background Color" }
}

// Removes this
ComponentName.propertyControls = {
  text: { type: ControlType.String, title: "Text" },
  color: { type: ControlType.Color, title: "Background Color" }
};

Quick start

Install the plugin first:

npm install --save-dev babel-plugin-framer-x

Then add it to your babel configuration:

{
  "plugins": ["babel-plugin-framer-x"]
}

About

A Babel plugin to remove Framer X code from your React components.

Resources

Packages

No packages published