ReactJS无法识别的令牌导入

我目前正在尝试学习使用ReactJS，但我遇到了问题，我似乎无法找到正确的解决方法。ReactJS无法识别的令牌导入

我已经安装了npm，并在我的项目的根目录下运行了npm --install react和npm --install react-dom。该项目是HTML/Javascript发布到PHP后端，我没有使用NodeJS，它似乎在我看到的内容中出现了很多，但从我的理解来看，Node并不是必需的。

我有以下的js文件

import * as ReactDOM from "react-dom"; 
import * as React from "react"; 
$(document).ready(function(){ 

    postToMiddleware(null, "account-manager.php", "testReact", function(result){ 
     alert(JSON.stringify(result)); 

     ReactDOM.render("<Names />", document.getElementById("names")); 
    }) 
}); 

class Names extends React.Component { 
    render() { 
     return (
      <p>Hello here is my react component</p> 
     ); 
    }; 
}

我的HTML页面包含的JavaScript文件之上，但随后我在Chrome控制台得到一个错误：

Uncaught SyntaxError: Unexpected token import

它抱怨线是第一行：

import * as ReactDOM from "react-dom";

如果它有什么区别 - 我假设没有，我在Wamp下运行的Windows上运行，不过当它运行时它将运行在运行Apache的Linux机器上。

UPDATE 因为我已经发现了进口替代，改变了两个导入线如下：

var ReactDOM = require("/node_modules/react-dom/"); var React = require("/node_modules/react");

但现在在Chrome中我得到：

Uncaught SyntaxError: Unexpected token <

哪个抱怨渲染返回线<p>Hello here is my react component</p>

来源

2017-07-14 Boardy

您不能在浏览器中使用类似于代码的反应代码，而无需翻译它。坚持使用@tomasz建议使用预定义的所有设置的样板应用程序 – baao

未捕获SyntaxError：意外的标记< - 您因为需要传输JSX语法而出现此错误。 Transpiler会将它转化为反应物体。 – Tomasz

您需要babel来处理诸如import语句和其他es6功能在现代浏览器中尚未提供的功能。如果您是新手，请考虑使用create-react-app-boilerplate，它可以为您处理所有这些问题。

来源

2017-07-14 16:22:44 Tomasz

感谢我看到了有关巴别塔，是为reactjs的要求，我也改变了进口要求，这似乎给我一个不同的错误，是因为巴别塔是必需的。它看起来像样板应用程序使用我不想使用的节点，是这种情况？ – Boardy

它不是，但您可能需要它才能导入和导出具有该语法的模块。 –

https://facebook.github.io/react/docs/react-without-es6.html查看如何在没有es6功能的情况下使用反应的反应文档。如果您使用npm，那么您已经在使用Node。 – Tomasz

ReactJS无法识别的令牌导入

回答

相关问题