react-laravel 意外的令牌答案

【问题标题】：react-laravel Unexpected tokenreact-laravel 意外的令牌
【发布时间】：2016-09-13 12:38:14
【问题描述】：

我正在尝试让 react-laravel 工作。我已经正确安装了所有东西（v8js 等），但我不断收到：

V8Js::executeString():18903: SyntaxError: Unexpected token <

问题似乎出在我的 component.js 文件上：

var Application = React.createClass({
    render: function() {
        return (
            <div className="Networks">
                <ul>
                    <li>Test</li>
                </ul>
            </div>
        );
    }
});

我该如何解决这个问题？

另外，是否可以使用 ES6？

我的看法：

<html>

<head>
    <title>JSPM Experiment</title>
    <script src="{{ asset('vendor/react-laravel/react.js') }}"></script>
    <script src="{{ asset('js/components.js') }}"></script>
    <script src="{{ asset('vendor/react-laravel/react_ujs.js') }}"></script>
</head>

<body>

<div id='react-root'>
</div>
@react_component('Application',[ 'title' => 'Hello, World' ], [ 'prerender' => true ])
</body>

</html>

【问题讨论】：

你没有提到你的构建管道 - 你是如何将它转换为 ES5 的？我假设 babel 带有 react 预设和 es2015 预设？
提供的代码看起来非常好。问题一定出在其他地方。 PS：去眼睛嘘！
我添加了我的观点:)
@DominicTobias 这不是构建过程，它只是动态加载东西
您不需要在退货时将 HTML 放在引号中吗？ return('<div ... </div>')

标签： php laravel reactjs laravel-5 react-laravel

【解决方案1】：

是“component.js”还是“components.js”？您可能有错字。

通常在尝试加载不存在的 javascript 文件时会收到 SyntaxError: Unexpected token <。 Laravel 渲染一个 404 HTML 页面，第一个 < 会触发你的 script 标签。

【讨论】：

【解决方案2】：

如果有人仍然出现这个错误，我安装了 Laravel 6 并设置了 React：

php artisan preset react
npm install

然后我收到了一个类似的错误“语法错误：意外标记”，因为 React JSX 语法似乎没有被理解。它通过更改 webpack.mix.js 中的 babel 配置得到修复：

mix.babelConfig({
  "presets": [
    "@babel/preset-react",
  ],
});

【讨论】：

【解决方案3】：

如果您对 Laravel 6 有疑问。请检查您的 webpack.mix.js 文件，它应该是 mix.react() 而不是 mix.js()

https://laravel.com/docs/6.x/mix#react

【讨论】：