当前位置: 首页 > 面试题库 >

Create-React-App构建-“未捕获的SyntaxError:意外令牌<”

景鸿才
2023-03-14
问题内容

我意识到这个问题已经被问过多次了,但对我来说却无济于事。

我正在尝试创建create-react-app项目的静态版本,但出现以下错误:

Uncaught SyntaxError: Unexpected token <     1.ca81c833.chunk.js:1
Uncaught SyntaxError: Unexpected token <     main.7ced8661.chunk.js:1

由于这些文件已缩小,因此我不确定从哪里开始调试它们。

根据其他SO响应,这是我尝试过的一些事情:

//Original index.html file, which gets included in the built file:
<script type="text/babel" src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script>

//package.json
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",

//.babelrc file
{
  "presets": ["react", "es2015", "stage-1"]
}

不知道这是否相关,但是我在我的Express服务器上有这个,我认为这是标准的:

if (process.env.NODE_ENV === "production") {

    app.use(express.static('client/built'));
    app.get("*", (req, res) => {
        res.sendFile(require('path')
            .resolve(__dirname, 'client', 'build', 'index.html'));
    })
}

假设这实际上是一个JSX问题,那么整个过程就很混乱-不create-react-app应该自动处理JSX吗?

更新 :我刚刚发布了这个问题,但是已经有了相关的更新。通过运行pm2 serve build,我可以通过pm2为页面提供静态服务,因此我认为问题可能出在我的服务器配置上。


问题答案:

我最终在这里找到答案:https :
//github.com/facebook/create-react-
app/issues/1812

我从上方修剪了完整的解决方案,但我进行了更改:

app.use(express.static('client/build'));
app.get("*", (req, res) => {
    res.sendFile(require('path')
        .resolve(__dirname, 'client', 'build', 'index.html'));
})

至:

const root = require('path').join(__dirname, 'client', 'build')
app.use(express.static(root));
app.get("*", (req, res) => {
    res.sendFile('index.html', { root });
})

我对第一个程序段不起作用肯定感到有些奇怪。我认为这与我的React项目中的相对链接有关,因为index.html尽管出现了错误,但确实将文件传递给了浏览器。也许一个完全静态的文件可以与第一个块一起使用,但是我想知道那是否正确。



 类似资料:
  • 问题内容: 我在MooTools脚本中运行AJAX调用,在Firefox中运行正常,但是在Chrome中出现错误,我无法确定原因。注释掉代码以确定错误代码在什么地方不会产生任何结果,我认为这可能与返回JSON有关。在控制台中检查,我看到返回的JSON是这样的: 我没有看到任何问题,为什么会发生此错误? 问题答案: 我刚刚解决了这个问题。导致标准Request调用出现问题的原因是,这是我改用的代码:

  • 问题内容: 我正在尝试开始在ReactJS中构建网站。但是,当我尝试将JS放在单独的文件中时,我开始收到此错误:“ Uncaught SyntaxError:Unexpected token <”。 我尝试添加到JS文件的顶部,但没有解决任何问题。以下是HTML和JS文件。关于出什么问题有什么想法吗? 的HTML JS 编辑:我意识到我需要添加到包括我的着陆器代码的脚本标签。但是,添加并重新加载后

  • 问题内容: 我正在尝试开始在ReactJS中构建网站。但是,当我尝试将JS放在单独的文件中时,我开始收到此错误:“ Uncaught SyntaxError:Unexpected token <”。 我尝试添加到JS文件的顶部,但没有解决任何问题。以下是HTML和JS文件。关于出什么问题有什么想法吗? HTML JS 编辑:我意识到我需要添加到包括我的着陆器代码的脚本标签。但是,添加并重新加载后,

  • 问题内容: 我从网络服务返回的JSON遇到问题。看起来JSON缺少引号,但是当我在JSON中添加引号时,出现错误。这是错误消息:’Uncaught SyntaxError:意外的标记o。当我将字符串记录到控制台时:[对象对象],[对象对象] 这是一些模拟错误的示例代码: 这是相同的代码,在字符串两边用单引号引起来。有用 但是,当我尝试在字符串中添加引号时,就像我在实际代码中似乎需要的那样,它失败了

  • 问题内容: 是什么导致第三行出现此错误? 打开控制台以查看错误 问题答案: 是一个对象。(从对象文字创建) 用于将包含JSON表示法的 字符串 转换为Javascript对象。 您的代码将对象转换为字符串(通过调用),以尝试将其解析为JSON文本。 默认返回,这是无效的JSON;因此错误。

  • 问题内容: 尝试传递以下字符串时出现语法错误: 我知道当我使用双引号时,错误来自链接。 如果我使用单引号,则没有问题,但是数据是从服务器端获取的,我无法控制要传入的内容,因此只能在我这一边进行控制。 到目前为止,我从互联网上阅读的内容尝试了以下操作: 先使用,然后再使用。我可以解析没有问题,但是当我尝试循环数据时会出现问题。循环不是将其作为JSON循环,而是将数据作为字符串并循环每个单个文本。 转