React プロジェクトのアップグレード エラー、babel エラー、.babelrc 構成の互換性、その他の問題

React プロジェクトのアップグレード エラー、babel エラー、.babelrc 構成の互換性、その他の問題

開発環境とプロジェクトのバージョン間の互換性の問題により、react-scripts をアップグレードしようとした後、次から次へと問題が発生し、Baidu や csdn で検索したところ、古い問題が解決されたり、新しい問題が現れたりすることがよくありました。開発は問題なくパッケージ化されました。 エラーを報告するには、発生した主な問題と参照用の最終的な解決策をリストします。

問題に遭遇する

デジタル エンベロープ ルーチン::サポートされていません

コマンドラインで $env:NODE_OPTIONS="--openssl-legacy-provider" を実行し、再度開始します。

解析エラー: この実験的な構文では、「decorators-legacy」、「decorators」のパーサー プラグインのいずれかを有効にする必要があります。

ESモジュールのrequire() ……はサポートしていません。

解析エラー: この実験的な構文では、「decorators-legacy」、「decorators」のパーサー プラグインのいずれかを有効にする必要があります。

[eslint] 「path」引数は文字列型である必要があります。配列のインスタンスを受け取りました

[eslint] .eslintrc の ESLint 設定が無効です:
- 予期しない最上位プロパティ「babel」。

最終的解決

ルート ディレクトリにある .babelrc ファイルを削除し、package.json で構成します。

 "babel": {
    
    
    "presets": [
      "react-app"
    ],
    "plugins": [
      [
        "@babel/plugin-proposal-decorators",
        {
    
    
          "legacy": true
        }
      ]
    ]
 },

必要に応じて依存関係をインストールします: "@babel/eslint-parser"

ノート

babel-eslint は 2020 年 3 月以降非推奨になりました。パッケージは新しいリポジトリに移行されました。必要に応じて「@babel/eslint-parser」を参照してください。