【MSAL】TypeError: Cannot read properties of undefined (reading 'endsWith')の解決策

最初に

今回のエラーは、msalを利用してMicrosot EntraIDでログイン、ログアウト機能を実装し、本番環境にデプロイしようとしたときに起きたエラーです。
node_modulesの中の@msal-commonのAuthority.tsで起きたエラーだったので、認証関係のエラーかと疑い、フロントエンド側をデプロイしているAzure static appsにAzure portalから環境変数を格納するも、うまくいきませんでした。
また、msal-reactとmsal-browserを最新にしても、エラーは消えませんでした。

環境

・Windows
・react 18.2.0
・typescript 4.9.5
・@azure/msal-react 2.0.13
・@azure/msal-browser 3.11.0

解決策

結論から言うと、GitHubActionsに環境変数を書くことでエラーは解決しました！

- name: Build And Deploy
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_BRAVE_HILL_07856D300 }}
          repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments)
          action: "upload"
          app_location: "Frontend" # App source code path
          api_location: "Backend" # Api source code path - optional
          output_location: "build" # Built app content directory - optional
        env: # Add environment variables here
            REACT_APP_CLIENT_ID:***************
            REACT_APP_AUTHORITY: https://login.microsoftonline.com/***********
            REACT_APP_REDIRECT_URI: https://**********.net/
            REACT_APP_SCOPES: api:*********/api.scope

環境変数は自分のものと置き換えてください。
Azure Deveopsを使う場合は、Azure pipelineのymlファイルに同じように書けば環境変数が読み込まれ、エラーは消えます。

感想

node_modules内のエラーだったので、最初はubuntu-latestのデフォルトのnodeが16なので古いのが原因かなと思いましたが、原因は環境変数がきちんと読み込まれていないことでした。
このエラーの情報は少なく、とても解決まで時間がかかりましたが、最後に解決できてよかったです。
みなさんも、デプロイの時は環境変数の読み込み方法にご注意ください！