Getting Started

Getting Started

Installation

Click here to install the extension in Vs-Code testimage

Project Setup

Vigma RN was developed the latest version of Expo with expo-router and typescript in mind. So we highly recommend you to start with a new project using the following command:

npx create-vigma-app

It's based on default Expo typescript template, but with a little modification to illustrate how to use Vigma RN. While your existing project may work, we can't guarantee it will work as expected.


Editing a component

Open a .tsx file in a react-native project, and you'll see two little blue icons in the top right corner of your editor: icons

The first one (in the shape of a cursor) will open current file in Vigma RN editor. The second one (in the shape of +) will create a new component file, and start editing it rightaway.

Figma plugin

If you want to implement the figma design into React Native, you can use our Figma-plugin (opens in a new tab). Checkout this page for more information.