ReactDOM is not definedエラーが出るときに確認すること

カテゴリ: 未分類 | タグ: , ,

発生した事象

Reactのプログラムをyarn run webpackで作成したところ、ビルドは通ったがブラウザで表示するとコンソールに下記のエラーが出力された。

(仕組みを理解するためにcreate-react-appを使わずに、手作業でwebpackの環境構築していた)

index.js:6 Uncaught ReferenceError: ReactDOM is not defined
    at Object../foo/index.js (index.js:6:1)
    at __webpack_require__ (bootstrap:19:1)
    at startup:3:1
    at startup:5:1

原因

作成した*.tsxのReactコンポーネントで、ReactDOMをimportするのを忘れていた。

対応

index.jsの先頭にimportの定義を追加して、ビルドし直したらエラー解消できた。

import ReactDOM from 'react-dom';
import React from 'react';
import {MyApp} from './features/MyApp.tsx';

ReactDOM.render(<MyApp />, document.getElementById('app'));

Amazonでおトクに買い物する方法
AmazonチャージでポイントGET


Amazonは買いもの前にAmazonギフト券をチャージしてポイントをゲットしないと損!

こちらもおススメ

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です