Chrome 中的 JSX/JavaScript 语法

JSX/JavaScript syntax in Chrome

本文关键字：JavaScript 语法 JSX 中的 Chrome      更新时间：2023-09-26

这真的很愚蠢，但我在Chrome上遇到了一个问题（在Firefox中工作正常），这种语法是从react-dnd组件中借用的示例（链接：https://github.com/gaearon/react-dnd/blob/master/examples/_dustbin-simple/Dustbin.js）。

const itemDropTarget = {
    acceptDrop(component, item) {
        component.setItem(item);
    }
};

它会触发此错误：

未捕获的语法错误：意外的令牌 （

Chrome也不喜欢这样：

const DustbinSimple = React.createClass({
    render() {

它必须是：

const DustbinSimple = React.createClass({
    render: function() {

我错过了什么？一定是我不明白的非常基本的东西。

提前谢谢。

JSX是Javascript的扩展。要在浏览器中实际运行它，必须通过 JSX 转换器运行它。

我找到了问题所在...我需要使用 --harmony 标志和 reactify/browserify 编译 JSX 代码：

...
bundler.transform(["reactify", {"harmony": true}]);
...

您可以将宗地捆绑器添加到项目中。它会自动转换您的代码，以便浏览器可以理解

相关文章：