発生した事象
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'));
こちらもおススメ