【React】react-scripts testでエラーが出た場合の対処方法

動作環境

react-scripts testでエラー

Reactの新しいプロジェクトを作成

npx create-react-app my-app

npm testコマンドでエラー

C:\repos\react_test\my-app> npm test 

> my-app@0.1.0 test C:\repos\react_test\my-app
> react-scripts test

Error: Failed to initialize watch plugin "node_modules/jest-watch-typeahead/filename.js":

  ● Test suite failed to run

    file:///C:/repos/react_test/my-app/node_modules/jest-watch-typeahead/build/file_name_plugin/prompt.js:4
    import { PatternPrompt, printPatternCaret, printRestoredPatternCaret } from 'jest-watcher';
                            ^^^^^^^^^^^^^^^^^
    SyntaxError: Named export 'printPatternCaret' not found. The requested module 'jest-watcher' is a CommonJS module, which may not support all module.exports as named exports.
    CommonJS modules can always be imported via the default export, for example using:

    import pkg from 'jest-watcher';
    const { PatternPrompt, printPatternCaret, printRestoredPatternCaret } = pkg;

      at async requireOrImportModule (node_modules/jest-util/build/requireOrImportModule.js:65:32)
      at async watch (node_modules/@jest/core/build/watch.js:337:34)
      at async _run10000 (node_modules/@jest/core/build/cli/index.js:311:7)
      at async runCLI (node_modules/@jest/core/build/cli/index.js:173:3)

npm ERR! Test failed.  See above for more details.

原因はnodeのversionが古いためエラーとなったようです。

nodeを最新にするため、公式サイトからダウンロードする

ダウンロード出来たらインストールを実行

Node.js — Run JavaScript Everywhere

Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

nodejs.org

npm testを再実行

PASS  src/App.test.js
  √ renders learn react link (41 ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        5.105 s
Ran all test suites.

エラーが解消されました。

version気を付けないと駄目ですね。。。

おすすめの書籍

おすすめのUdemy講座

モダンJavaScriptの基礎から始める挫折しないためのReact入門

【Reactアプリ開発】3種類のReactアプリケーションを構築して、Reactの理解をさらに深めるステップアップ講座