OfficeDev / teams-toolkit

Developer tools for building Teams apps
Other
453 stars 185 forks source link

🐞 TTK Errors when building Tab projects with AzFunc backend (Tab > React w/ Fluent UI) 🚨 TS1452: 'resolution-mode' assertions are only supported when `moduleResolution` is `node16` or `nodenext`. #12445

Open andrewconnell opened 2 hours ago

andrewconnell commented 2 hours ago

Describe the bug When building a new project using the Tab > React w/ Fluent UI > TypeScript template, the Watch Backend task that runs the following npm run watch:teamsfx in the ./api Azure Function subfolder throws a bunch of TypeScript compilation errors that emit from @azure/msal-common, @azure/msal-node, & botframework-streaming packages.

I've observed this on three of my machines (all MacOS, two MacOS v14, one v15) & in multiple student machines (mix of MacOS & Windows).

Confirmed I'm using Node.js v18 & tried running the npm run watch:teamsfx from the ./api folder from a new terminal window.

Click to view errors ❌ in the terminal window output from **Watch Backend** ```console [3:38:29 PM] Starting compilation in watch mode... node_modules/botframework-connector/node_modules/@azure/msal-common/lib/types/broker/nativeBroker/INativeBrokerPlugin.d.ts:1:23 - error TS1452: 'resolution-mode' assertions are only supported when `moduleResolution` is `node16` or `nodenext`. 1 /// ~~~~ node_modules/botframework-connector/node_modules/@azure/msal-node/dist/config/Configuration.d.ts:1:23 - error TS1452: 'resolution-mode' assertions are only supported when `moduleResolution` is `node16` or `nodenext`. 1 /// ~~~~ node_modules/botframework-connector/node_modules/@azure/msal-node/dist/config/Configuration.d.ts:2:23 - error TS1452: 'resolution-mode' assertions are only supported when `moduleResolution` is `node16` or `nodenext`. 2 /// ~~~~ node_modules/botframework-connector/node_modules/@azure/msal-node/dist/config/Configuration.d.ts:4:8 - error TS1192: Module '"http"' has no default export. 4 import http from "http"; ~~~~ node_modules/botframework-connector/node_modules/@azure/msal-node/dist/config/Configuration.d.ts:5:8 - error TS1192: Module '"https"' has no default export. 5 import https from "https"; ~~~~~ node_modules/botframework-connector/node_modules/@azure/msal-node/dist/request/InteractiveRequest.d.ts:1:23 - error TS1452: 'resolution-mode' assertions are only supported when `moduleResolution` is `node16` or `nodenext`. 1 /// ~~~~ node_modules/botframework-streaming/lib/webSocket/nodeWebSocket.d.ts:8:8 - error TS1259: Module '"/Users/ac/_play/TeamsTabs01/api/node_modules/@types/ws/index"' can only be default-imported using the 'esModuleInterop' flag 8 import WebSocket from 'ws'; ~~~~~~~~~ node_modules/@types/ws/index.d.ts:244:1 244 export = WebSocket; ~~~~~~~~~~~~~~~~~~~ This module is declared with 'export =', and can only be used with a default import when using the 'esModuleInterop' flag. [3:38:34 PM] Found 7 errors. Watching for file changes. ```

To Reproduce Steps to reproduce the behavior:

  1. Create a new project using the Tab > React w/ Fluent UI > TypeScript template
  2. Start debugging using the Run & Debug > PLAY
  3. Watch for the Watch Backend terminal window to launch & fail.
  4. Open Watch Backend terminal and observe errors.

Expected behavior The task Watch Backend runs without errors.

Screenshots n/a

VS Code Extension Information (please complete the following information):

CLI Information (please complete the following information):

Additional context

Looks related to #12430 ... same workaround in #12430 mitigates this.

microsoft-github-policy-service[bot] commented 1 hour ago

Thank you for contacting us! Any issue or feedback from you is quite important to us. We will do our best to fully respond to your issue as soon as possible. Sometimes additional investigations may be needed, we will usually get back to you within 2 days by adding comments to this issue. Please stay tuned.