Skip to content

Latest commit

 

History

History
47 lines (34 loc) · 1.88 KB

File metadata and controls

47 lines (34 loc) · 1.88 KB

ES6 + TypeScript + Babel + React + Karma: The Secret Recipe

Getting started

You'll need node / npm and Typings installed globally. To get up and running just enter:

npm install
typings install
npm run serve

This will:

  1. Download the npm packages you need
  2. Download the type definitions you need.
  3. Compile the code and serve it up at http://localhost:8080

Now you need dev tools. There's a world of choice out there; there's Atom, there's VS Code, there's Sublime. There's even something called Visual Studio. It's all your choice really.

For myself I've been using Atom combined with the mighty atom-typescript package. I advise you to give it a go. You won't look back.

I want to have an ASP.Net project and use Visual Studio + IIS Express to serve this instead

If you drop this code into an empty Visual Studio ASP.Net project should should be good to go. You'll need this section in your web.config to ensure Visual Studio serves from the dist directory:

<configuration>
  <system.webServer>
    <rewrite>
      <rules>
        <rule name="Map all requests to 'dist' directory" stopProcessing="true">
          <match url="^(.*)$" />
          <action type="Rewrite" url="/dist/{R:1}" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>
</configuration>

And rather than running npm run serve you'll want to use npm run watch. (This builds / watches your code / runs tests etc but does not spin up a web server.)

Finally you'll want to set the following TypeScript options for your project

  • ECMAScript Version: ECMAScript 6
  • JSX compilation in TSX files: Preserve