How to setup Material-UI for React with Typescript?

Question

I\'ve run in some problems add Material UI to my React project, which is programmed with Typescript.

According to the tutorial, I start with adding the react-tab-event-p

Answer 1

@types/material-ui is now available, exported from its DefinitelyTyped source.

npm install @types/material-ui --save-dev

npm install @types/react-tap-event-plugin --save-dev

Afterwards, you can do following:

import * as injectTapEventPlugin from 'react-tap-event-plugin';

// Needed for onTouchTap
// Check this repo:
// https://github.com/zilverline/react-tap-event-plugin
injectTapEventPlugin();

Then use Material UI like this:

import * as React from 'react';
import getMuiTheme from 'material-ui/styles/getMuiTheme';
import {MuiThemeProvider, lightBaseTheme} from "material-ui/styles";

const lightMuiTheme = getMuiTheme(lightBaseTheme);

class Root extends React.Component {
  render() {
    return (
      
        
      
    )
  }
}

The MyComponent would consume Material UI as defined in the docs:

import RaisedButton from 'material-ui/RaisedButton';

const MyComponent = (props:MyComponentProps) => {
  return (
      
  )
}

export default MyComponent;

2016-08-08: Answer updated due to state change of the package.

2017-01-03: Add ref. to @types /qvazzler