These days I tried to set up react native on windows. After I found React Native extensions for Visual Studio Code I thought that would be an easy thing. But as always I ran in some issues which I want to share with you.

React Native extension for Visual Studio Code

Starting with Visual Studio Code, you can install it from http://code.visualstudio.com. Visual Studio can also be used on Mac, so it’s the perfect tool for cross mobile platform development. The React Native Tools can be downloaded from the marketplace or installed via the command line in visual studio with the command „ext install vscode-react-native“. 

Next to the Intellisense for React Native Code which is added through the extension also all commands from React Native are now accessible through the command palette in Visual Studio Code.

2016-11-24

Setting up React Native

After the easy job setting up Visual Studio Code, you also have to install the React Native and all its required dependencies. The React Native Website contains a good getting started, but some steps are missing.

Install Node and Python

Node.js and Python2 can be easily installed via Chocolatey, like mentioned on the page, via the following commands if not already present on the maschine.

choco install nodejs.install
choco install python2

Install React Native CLI

The React Native CLI can be installed with NPM, the package manager from Node.js, via the command:

npm install -g react-native-cli</pre>

Android Development Enviroment

The Android development environment has to be installed like mentioned on the getting started page if you not already installed the required tools. If you have already installed Visual Studio with Xamarin and you developed some Android applications you should be fine. But make sure to have thee following environment variables registered:

  • ANDROID_HOME
  • JAVA_HOME

Create and run the project

After you did the mentioned steps you should be ready to create a new React Native project from the command line:

react-native init YourProject

The created folder can be opened and debugged in Visual Studio Code with no additional effort.

2016-11-24-1

Leave a Reply

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>