esbuild-darwin-64 missing (Apple Silicon) #51

ong-yinggao98 · 2021-10-06T13:22:32Z

Describe the bug

Attempting to preview an element causes React Preview to complain that esbuild-darwin-64 is missing. However, the package is not compatible with Apple Silicon as it is for x64 not ARM64.

Reproduction

Click on Open React Element in React Preview

React Preview version

v0.7.1

System Info

System:
    OS: macOS 11.6
    CPU: (8) arm64 Apple M1
    Memory: 159.30 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.10.0 - /opt/homebrew/bin/node
    npm: 7.24.0 - /opt/homebrew/bin/npm
  IDEs:
    Nano: 2.0.6 - /usr/bin/nano
    VSCode: 1.60.2 - /usr/local/bin/code
    Vim: 8.2 - /opt/homebrew/bin/vim
    Xcode: 13.0/13A233 - /usr/bin/xcodebuild
  Browsers:
    Chrome: 94.0.4606.71
    Safari: 15.0

Used Package Manager

npm

Extension logs (useful for crashes)

added 107 packages, and audited 108 packages in 14s

23 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities


Bootstrapped successfully.
React Preview Server running at http://localhost:3140.
Error: The package "esbuild-darwin-64" could not be found, and is needed by esbuild.

If you are installing esbuild with npm, make sure that you don't specify the
"--no-optional" flag. The "optionalDependencies" package.json feature is used
by esbuild to install the correct binary executable for your current platform.
    at generateBinPath (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/esbuild/lib/main.js:1642:15)
    at esbuildCommandAndArgs (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/esbuild/lib/main.js:1698:11)
    at ensureServiceIsRunning (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/esbuild/lib/main.js:1855:25)
    at Object.build (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/esbuild/lib/main.js:1748:26)
    at /Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/vite/dist/node/chunks/dep-24231913.js:50679:54
    at Array.map (<anonymous>)
    at scanImports (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/vite/dist/node/chunks/dep-24231913.js:50679:31)
    at processTicksAndRejections (internal/process/task_queues.js:93:5)
    at async optimizeDeps (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/vite/dist/node/chunks/dep-24231913.js:71133:30)
    at async runOptimize (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/vite/dist/node/chunks/dep-24231913.js:74997:48)
events.js:292
      throw er; // Unhandled 'error' event
      ^

Error: listen EADDRINUSE: address already in use :::3140
    at Server.setupListenHandle [as _listen2] (net.js:1318:16)
    at listenInCluster (net.js:1366:12)
    at Server.listen (net.js:1452:7)
    at Function.v.listen (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/635.js:2:246900)
    at /Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/index.js:1:29647
    at new Promise (<anonymous>)
    at t.ReactPreviewServer.start (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/index.js:1:29601)
    at /Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/index.js:1:27437
    at async t.Previewer.startFromStopped (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/index.js:1:27521)
    at async t.Previewer.start (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/index.js:1:26400)
Emitted 'error' event on Server instance at:
    at emitErrorNT (net.js:1345:8)
    at processTicksAndRejections (internal/process/task_queues.js:80:21) {
  code: 'EADDRINUSE',
  errno: -48,
  syscall: 'listen',
  address: '::',
  port: 3140
}
[Info  - 9:13:06 PM] Connection to server got closed. Server will restart.
Bootstrapped successfully.
React Preview Server running at http://localhost:3140.
Error: The package "esbuild-darwin-64" could not be found, and is needed by esbuild.

If you are installing esbuild with npm, make sure that you don't specify the
"--no-optional" flag. The "optionalDependencies" package.json feature is used
by esbuild to install the correct binary executable for your current platform.
    at generateBinPath (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/esbuild/lib/main.js:1642:15)
    at esbuildCommandAndArgs (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/esbuild/lib/main.js:1698:11)
    at ensureServiceIsRunning (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/esbuild/lib/main.js:1855:25)
    at Object.build (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/esbuild/lib/main.js:1748:26)
    at /Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/vite/dist/node/chunks/dep-24231913.js:50679:54
    at Array.map (<anonymous>)
    at scanImports (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/vite/dist/node/chunks/dep-24231913.js:50679:31)
    at processTicksAndRejections (internal/process/task_queues.js:93:5)
    at async optimizeDeps (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/vite/dist/node/chunks/dep-24231913.js:71133:30)
    at async runOptimize (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/vite/dist/node/chunks/dep-24231913.js:74997:48)
events.js:292
      throw er; // Unhandled 'error' event
      ^

Error: listen EADDRINUSE: address already in use :::3140
    at Server.setupListenHandle [as _listen2] (net.js:1318:16)
    at listenInCluster (net.js:1366:12)
    at Server.listen (net.js:1452:7)
    at Function.v.listen (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/635.js:2:246900)
    at /Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/index.js:1:29647
    at new Promise (<anonymous>)
    at t.ReactPreviewServer.start (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/index.js:1:29601)
    at /Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/index.js:1:27437
    at async t.Previewer.startFromStopped (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/index.js:1:27521)
    at async t.Previewer.start (/Users/admin/.vscode/extensions/zenclabs.reactpreview-0.7.1/dist/server/node_modules/@reactpreview/core/lib/index.js:1:26400)
Emitted 'error' event on Server instance at:
    at emitErrorNT (net.js:1345:8)
    at processTicksAndRejections (internal/process/task_queues.js:80:21) {
  code: 'EADDRINUSE',
  errno: -48,
  syscall: 'listen',
  address: '::',
  port: 3140
}
[Info  - 9:15:23 PM] Connection to server got closed. Server will restart.
Bootstrapped successfully.
React Preview Server running at http://localhost:3140.

Preview logs (useful for rendering errors)

No response

Anything else?

No response

The text was updated successfully, but these errors were encountered:

fwouts · 2021-10-07T02:15:49Z

Hi @ong-yinggao98, thanks for reporting the bug!

If you'd like a temporary workaround, you can check out #49 (reply in thread)

ong-yinggao98 · 2021-10-07T07:36:26Z

Hi @ong-yinggao98, thanks for reporting the bug!

If you'd like a temporary workaround, you can check out #49 (reply in thread)

Hmmm I've tried removing the node_modules folder and running npm install esbuild without the --no-optionals flag as mentioned but it still gives me the same error. I've also tried restarting VS Code too before doing that too.

fwouts · 2021-10-07T11:06:50Z

Thank you for trying this out, and sorry it didn't fix it for you!

Can you also confirm whether you're using the "Universal" or "Apple Silicon" version of VS Code?

ong-yinggao98 · 2021-10-08T06:25:02Z

Thank you for trying this out, and sorry it didn't fix it for you!

Can you also confirm whether you're using the "Universal" or "Apple Silicon" version of VS Code?

Argh, I realised I was using the universal version for some reason. It works perfectly fine on the native build.

fwouts · 2021-10-08T23:33:43Z

I wouldn't say that's your mistake, ideally React Preview would work either way (in fact that was the case before esbuild started using optional dependencies). I'll keep this bug open so others find the solution more easily and I'll see if I can at least make the error more helpful.

keithkraker · 2021-10-18T18:44:17Z

I'm running into the same issue. I tried the temporary workaround but it didn't seem to work. The only thing that worked was downgrading to react preview to version 0.5.5. Version 0.6.0 and newer throw this error for me.

fwouts · 2021-10-19T21:36:21Z

Hi @keithkraker, just so I could try reproducing and hopefully fixing this, would you mind sharing the details of your VS Code, node and npm versions?

keithkraker · 2021-10-20T01:07:11Z

Yeah, no problem.

VS Code: 1.61.1
Node: 14.18.0
NPM: 7.24.1

ong-yinggao98 added pending triage vscode labels Oct 6, 2021

fwouts added bug Something isn't working and removed pending triage labels Oct 7, 2021

ong-yinggao98 closed this as completed Oct 8, 2021

fwouts reopened this Oct 8, 2021

fwouts added the react preview label Jan 11, 2022

fwouts mentioned this issue Feb 20, 2022

Proposal: include binary architecture when available tabrindle/envinfo#219

Open

fwouts added the stale label Apr 19, 2022

fwouts closed this as completed Apr 19, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

esbuild-darwin-64 missing (Apple Silicon) #51

esbuild-darwin-64 missing (Apple Silicon) #51

ong-yinggao98 commented Oct 6, 2021

fwouts commented Oct 7, 2021

ong-yinggao98 commented Oct 7, 2021

fwouts commented Oct 7, 2021

ong-yinggao98 commented Oct 8, 2021

fwouts commented Oct 8, 2021

keithkraker commented Oct 18, 2021

fwouts commented Oct 19, 2021

keithkraker commented Oct 20, 2021

esbuild-darwin-64 missing (Apple Silicon) #51

esbuild-darwin-64 missing (Apple Silicon) #51

Comments

ong-yinggao98 commented Oct 6, 2021

Describe the bug

Reproduction

React Preview version

System Info

Used Package Manager

Extension logs (useful for crashes)

Preview logs (useful for rendering errors)

Anything else?

fwouts commented Oct 7, 2021

ong-yinggao98 commented Oct 7, 2021

fwouts commented Oct 7, 2021

ong-yinggao98 commented Oct 8, 2021

fwouts commented Oct 8, 2021

keithkraker commented Oct 18, 2021

fwouts commented Oct 19, 2021

keithkraker commented Oct 20, 2021