javascript - 无法通过 unpkg 使用 MATERIAL-UI & React
问题描述
我正在尝试通过 cdn 直接加载反应和材料 ui，但无法让材料 ui 工作。
这是我到目前为止尝试过的代码
索引.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Bundleless React</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500">
</head>
<body>
<div id="root"></div>
<script src="https://unpkg.com/react@16/umd/react.production.min.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js" crossorigin></script>
<script src="https://unpkg.com/@material-ui/core/umd/material-ui.production.min.js" crossorigin="anonymous"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<script src="./index.jsx" type="text/babel"></script>
</body>
</html>
索引.jsx
ReactDOM.render(<h1>Hello World</h1>, document.getElementById("root"));
上面的代码仅适用于 React，但是当我尝试使用如下所示的材质 UI 组件时，它会引发错误。
索引.jsx
ReactDOM.render(
<Button variant="contained" color="primary">
Hello World
</Button>,
document.getElementById("root")
);
上面的代码Button is not defined在控制台中抛出错误。我该如何解决这个问题？