ReactJS ReferenceError：未定義導出

Question

我一直在嘗試建立一個基本的 ReactJS 項目，但沒有取得多大成功，我有這三個文件：

[索引.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>

[腳本/app.js]

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

[腳本/index.js]

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

我一直收到這些錯誤：

ReferenceError: exports is not defined
Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

所有文件都可用並通過 Golang 網絡服務器提供。 我沒有像 Webpack 這樣的 JS 打包器，我想知道我目前做錯了什么。 我試過import但我只是得到：

ReferenceError: import is not defined

感謝您的幫助！

Answer 1

你跟風一樣嗎？

[腳本/App.js]

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

[腳本/index.js]

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

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

Answer 2

您忘記了導入，這些對於使用其功能很重要，否則會引用錯誤：“未定義導入”

嘗試添加這個

import React from "react";

前

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

在你的 index.js 文件中添加這個

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

import App from "./App";

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

ReactJS ReferenceError：未定義導出

問題描述

2 個解決方案

解決方案1
0 2020-01-07 03:18:52

解決方案2
0 已采納 2020-01-07 06:33:58

ReactJS ReferenceError：未定義導出

問題描述

2 個解決方案

解決方案1 0 2020-01-07 03:18:52

解決方案2 0 已采納 2020-01-07 06:33:58

解決方案1
0 2020-01-07 03:18:52

解決方案2
0 已采納 2020-01-07 06:33:58