SyntaxError：意外令牌，应为“ ”
SyntaxError: Unexpected token, expected “”
提示:本站收集StackOverFlow近2千万问答，支持中英文搜索，鼠标放在语句上弹窗显示对应的参考中文或英文， 本站还提供 中文繁体 英文版本 中英对照 版本，有任何建议请联系yoyou2525@163.com。
添加此问题是因为我无法轻松地在线找到答案。
我正在尝试使用react-testing-library来测试组件是否正确呈现。 但是，我收到许多似乎没有太大帮助的错误。
这是我的测试文件（ report.test.ts ，以及代码中的组件）：
import { render } from "react-testing-library";
import "jest-dom/extend-expect";
import Report from "./Report";
test("component", () => {
const reportData = {
name: "test-report-name",
url: "test-url"
};
const { getByText } = render(<Report report={reportData} />);
expect(getByText("test-report-name")).toHaveAttribute("href", "test-url");
});
当我尝试运行测试时，出现错误SyntaxError: Unexpected token, expected "</>" 。 VS Code中有一条弯曲的红色线条，悬停时说Argument of type 'Report' is not assignable to parameter of type 'ReactElement<any>' 。
即使我将Report标记更改为简单的<div /> ，也得到Cannot find name 'div' 。
我的考试有什么问题？
2 个回复
测试文件扩展名应该被识别为使用React语法的文件（例如tsx ），并且React应该使用import React from "react";来定义import React from "react"; 。
当使用JSX语法时，似乎必须在文件中定义React，并且文件类型也必须被识别为使用React的文件类型。 因此，如果测试文件具有js扩展名，则可能需要进行类似的更改。
问题出在这里：每当您键入<div>Foo</div> ， <Component />或其他非标准JavaScript的JSX语法时。 如果打开浏览器控制台并键入<div /> ，则会收到Uncaught SyntaxError: Unexpected token < 。
那么浏览器如何管理读取您的XML代码？ 根据您的配置，您可以将JSX转换为普通的旧JavaScript，通常是babel 。
每当您输入<div className="foo">Hello</div> ，该代码都会转换为React.createElement('div', {className: 'foo'}, 'Hello') 。 实际上，如果需要，您可以使用createElement编码，并跳过整个JSX。
您的测试也是如此。
在您的示例中render(React.createElement(Report, {report: reportData}, null))在运行测试之前render(React.createElement(Report, {report: reportData}, null))将render(<Report report={reportData} />)转换为render(React.createElement(Report, {report: reportData}, null)) 。
这就是为什么您有一个错误； 您正在尝试访问React createElement方法，但未导入它。
导入React将修复您的测试。
声明：本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.