我只是从Reactjs开始，正在编写一个简单的组件来显示
li标签并遇到此错误：
意外的令牌“ <”
我将示例放在http://jsbin.com/UWOquRA/1/edit?html、js、console、output下方的jsbin上
请让我知道我做错了。
React.js：意外的令牌“ <”错误
第1180篇《React.js：意外的令牌“ <”错误》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点
共9个回答
这是您可以使用html的另一种方法
<head>
<title>Parcel Sandbox</title>
<meta charset="UTF-8" />
</head>
<body>
<div id="app"></div>
<script src="src/index.js"></script>
</body>
</html>
路径为src / index.js的index.js文件
import React from "react";
import { render } from "react-dom";
import "./styles.scss";
const App = () => (
<div>
<h1>Hello test</h1>
</div>
);
render(<App />, document.getElementById("app"));
使用此package.json将使您快速启动并运行
{
"name": "test-app",
"version": "1.0.0",
"description": "",
"main": "index.html",
"scripts": {
"start": "parcel index.html --open",
"build": "parcel build index.html"
},
"dependencies": {
"react": "16.2.0",
"react-dom": "16.2.0",
"react-native": "0.57.5"
},
"devDependencies": {
"@types/react-native": "0.57.13",
"parcel-bundler": "^1.6.1"
},
"keywords": []
}
就我而言，除了babel预设，我还必须将其添加到我的.eslintrc：
{
"extends": "react-app",
...
}
如果您像我一样容易出错，还请检查package.json是否包含您的babel预设：
"babel": {
"presets": [
"env",
"react",
"stage-2"
]
},
就我而言，我未能在脚本标签中包含type属性。
<script type="text/jsx">
我有此错误，两天都无法解决。因此，错误的修复非常简单。在正文中，您可以在其中连接script，添加type="text/jsx"并解决问题。
更新：在React 0.12+中，不再需要JSX编译指示。
确保在文件顶部包含JSX编译指示：
/** @jsx React.DOM */
没有此行，jsx二进制和浏览器内的转换器将使您的文件保持不变。
您需要将该JSX代码转换/编译为javascript或使用浏览器内转换程序
查看http://facebook.github.io/react/docs/getting-started.html并记下这些<script>标记，您需要这些标记才能在浏览器中使用JSX。
我使用type =“ text / babel”解决了它
<script src="js/reactjs/main.js" type = "text/babel"></script>
相似问题
问题类别
虽然，我在.babelrc配置文件中安装了所有正确的babel加载器。这个带有parcel-bundler的构建脚本在手动刷新页面时在浏览器控制台中产生了意外的令牌错误<和mime类型错误。
更新构建脚本为我解决了问题。