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>
答
您需要babel来处理诸如import
语句和其他es6功能在现代浏览器中尚未提供的功能。如果您是新手,请考虑使用create-react-app-boilerplate,它可以为您处理所有这些问题。
您不能在浏览器中使用类似于代码的反应代码,而无需翻译它。坚持使用@tomasz建议使用预定义的所有设置的样板应用程序 – baao
未捕获SyntaxError:意外的标记 Tomasz