反应路由器参数化路由：SyntaxError：预期表达式，得到'<'

Posted 2023-02-21

【中文标题】反应路由器参数化路由：SyntaxError：预期表达式，得到\'<\'

【英文标题】：React router parametrized routes: SyntaxError: expected expression, got '<'反应路由器参数化路由：SyntaxError：预期表达式，得到'<'

【发布时间】：2016-07-20 15:24:08

【问题描述】：

我设置了一个使用参数化路由的 React-router：

<Route path="/comments" comments=comments.commentsArray component=NewReactElement />
    <Route path="/comments/:id" component=Comment />

错误：SyntaxError: expected expression, got '<'

我研究了这个错误，发现它是在服务器尝试获取 .js/.css/other 文件时发生的，但返回的 html 以 <!DOCTYPE> 开头，所以我设置了 express.static ，但是在输入comments/1250等URL时，仍然返回：SyntaxError: expected expression, got '<'。这是我的服务器设置：

app.use(express.static(__dirname + '/views/webpacked'));
app.listen(5000);

app.get('*', (req, res) => 

    res.sendFile(path.resolve(__dirname, 'views', 'webpacked', 'index.html'));

 );

我也试过了：

app.use('/*/*', express.static(...));

但它也不起作用。

提前感谢您的建议。

【参考方案1】：

将/ 添加到bundle.js 为this answer suggested 后，问题仍然存在。

我可以通过在我的项目目录中运行 rm -rf .cache 来解决这个问题，就像 github issue 一样。

【参考方案2】：

我有一个没有任何 express 的 react/react-router 页面并且得到了同样的错误： SyntaxError: expected expression, got '<' 一旦我配置了一个反应路线就开始出现，而不是根/。

经过一些实验，我发现在我的 index.html 中有一个指向 js 文件的链接：

  <script src="bundle.js"></script>
</body>
</html>

因此，解决方案是在源路径中添加/：

  <script src="/bundle.js"></script>
</body>
</html>

并且错误消失了。

希望能有所帮助。

【讨论】：

哇，它确实有效......我想知道为什么当我访问非参数路线时它没有'/'也能正常工作

非常感谢，这就是答案，我仍然像 Jakub Kopys 一样想知道为什么会这样。