1

I am trying to include cdn link for my react js app. What would be the link to include material ui. http://www.material-ui.com/#/

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>First React App</title>
    <script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
    <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
    <script src="https://unpkg.com/[email protected]/babel.min.js"></script>
</head>

<body>
<div id="container" style="font-style: italic;"></div>

<script type="text/babel">
    var destination = document.querySelector("#container");

    ReactDOM.render(
            <h1>My First App</h1>,
        destination);
</script>
</body>

</html>
1
  • 1
    I don't think Material UI is available via a CDN - You'd have to install it via NPM. I suggest you check out Create React App if you want a quick way to get up and running. Commented Nov 7, 2017 at 21:28

1 Answer 1

1

The way to include material ui is through npm rather than a CDN link like traditional Frontend frameworks or libraries.

The correct way to to do it is through npm packages.

You install the library by running

npm install material-ui

Then you can use it inside your react component as below

import React from 'react';
import ReactDOM from 'react-dom';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import MyAwesomeReactComponent from './MyAwesomeReactComponent';

const App = () => (
  <MuiThemeProvider>
    <MyAwesomeReactComponent />
  </MuiThemeProvider>
);

ReactDOM.render(
  <App />,
  document.getElementById('app')
);

You can read more about it here http://www.material-ui.com/#/get-started/installation

Sign up to request clarification or add additional context in comments.

1 Comment

It shouldn't be the only way. There seems to be no way to use an AMD loader (requirejs) with material-ui. You can do it with react and react-dom.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.