問(wèn)題 001
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>hello world</title>
</head>
<body>
<div id="root"></div>
<!-- 加載 React。-->
<!-- 注意: 部署時(shí)，將 "development.js" 替換為 "production.min.js"。-->
<script
src="https://unpkg.com/react@17/umd/react.development.js"
crossorigin
></script>
<script
src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"
crossorigin
></script>
<!-- 加載我們的 React 組件。-->
<script src="./like_button.js"></script>
</body>
</html>
報(bào)錯(cuò)
Uncaught SyntaxError: Unexpected token '<'
錯(cuò)誤問(wèn)題001
解決方法:
1、在引入react組件的src 上增加 type="text/babel"
2、引入 <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>hello world</title>
</head>
<body>
<div id="root"></div>
<!-- 加載 React。-->
<!-- 注意: 部署時(shí)，將 "development.js" 替換為 "production.min.js"。-->
<script
src="https://unpkg.com/react@17/umd/react.development.js"
crossorigin
></script>
<script
src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"
crossorigin
></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<!-- 加載我們的 React 組件。-->
<script type="text/babel" src="./like_button.js"></script>
</body>
</html>
解決辦法001
完美解決
