Javascript ReactJS ReferenceError:未定义导出_Javascript_Reactjs

Javascript ReactJS ReferenceError:未定义导出

javascript reactjs

Javascript ReactJS ReferenceError:未定义导出,javascript,reactjs,Javascript,Reactjs,我一直在尝试建立一个基本的ReactJS项目，但没有成功，我有以下三个文件： [index.html] <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title>MarkEdit</title> <link rel="stylesheet" href="style

我一直在尝试建立一个基本的ReactJS项目，但没有成功，我有以下三个文件：

[index.html]

<!DOCTYPE html>
<html lang="en" dir="ltr">
    <head>
        <meta charset="utf-8">
        <title>MarkEdit</title>
        <link rel="stylesheet" href="stylesheets/minireset.css"></link>
        <link rel="stylesheet" href="stylesheets/index.css"></link>
        <script src="https://unpkg.com/react@16/umd/react.development.js"></script>
        <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
        <script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
        <script type="text/babel" src="scripts/app.js"></script>
        <script type="text/babel" src="scripts/index.js"></script>
    </head>
    <body>
        <main id="application"></main>
    </body>
</html>

所有文件均可用，并通过Golang Web服务器提供。我没有像Webpack一样的JS捆绑包，我想知道我现在做错了什么。我已尝试导入，但我只得到：

ReferenceError: import is not defined

谢谢你的帮助

你也在遵循同样的原则吗

[脚本/App.js]

import React from "react";
export default class App extends React.Component {
  render() {
    return <h1>Hello, World!</h1>;
  }
}

从“React”导入React；
导出默认类App扩展React.Component{
render（）{
回复你好，世界！；
}
}

[脚本/index.js]

ReactDOM.render(<App/>, document.getElementById("application"));

import React from "react";
import ReactDOM from "react-dom";
import App from "./App";

const rootElement = document.getElementById("application");
ReactDOM.render(<App />, rootElement);

从“React”导入React；
从“react dom”导入react dom；
从“/App”导入应用程序；
const rootElement=document.getElementById（“应用程序”）；
render（，rootElement）；

您忘记了导入，这些对于使用其功能很重要，否则它将引用错误：“未定义导入”

尝试添加这个

import React from "react";

以前

export default class App extends React.Component {
    render() {
        return (
            <h1>Hello, World!</h1>
        );
    }
}

导出默认类App扩展React.Component{
render（）{
返回(
你好，世界！
);
}
}

在index.js文件中添加以下内容

import React from "react";
import ReactDOM from "react-dom";

import App from "./App";

const rootElement = document.getElementById("application");
ReactDOM.render(<App />, rootElement);

从“React”导入React；
从“react dom”导入react dom；
从“/App”导入应用程序；
const rootElement=document.getElementById（“应用程序”）；
render（，rootElement）；

这个问题与此类似：@MattCarlotta，但我确实使用了babel，而您刚才链接的问题的作者没有。他使用了，只是没有将其包含在他的示例中（请参见此处的第一个示例：）。同样，

JSX

无效

HTML

。从现在起，您将使客户在每次访问时都传输它。相反，它应该编译成JS。但是，在编译时，它仍然需要第三方库来处理

require

（

import

编译为

require

）语句。建议通过创建React应用程序启动React应用程序@Whiteclaws create react应用程序不需要您将NodeJ用作后端。它使用npm来促进前端文件的创建。只要通过XHR与后端通信，后端就可以是您想要的任何东西。

export default class App extends React.Component {
    render() {
        return (
            <h1>Hello, World!</h1>
        );
    }
}

import React from "react";
import ReactDOM from "react-dom";

import App from "./App";

const rootElement = document.getElementById("application");
ReactDOM.render(<App />, rootElement);