Code
Framer X

How to change the default code editor?

Use “External editor”

The internal editor in Framer X is fine, but sometimes it’s buggy and sluggish. You can change it to use an external editor from the menu: View => Editor => External.

Pro tip: Using an external editor is a big time saver when you want to work on the code and see the design canvas at the same time.

Change the default external code editor

VSCode is great but what if you want to use Atom, Vim, Emacs etc.? Answer:

  1. File -> Show package
  2. Navigate to a .tsx file
  3. Right click -> “Get Info”
  4. Choose an app in “Open With”.
  5. Click “Change All” and profit!

PS: If you find this tip difficult to understand, check out this course I prepared for you, where concepts are explained in a more digestible way. No programming experience required!

PPS: See other pro tips, or share / request a new tip.


© 2019 jimu Labs, Inc.