Vite 5 is not supported

[wylieconlon]

Bug report

When using Vite 5 with Sandpack, it throws this error. There is a workaround using the package.json overrides field, but that workaround is broken in Sandpack.

Uncaught (in promise) Error: Your current platform "linux" and architecture "x32" combination is not yet supported by the native Rollup build. Please use the WASM build "@rollup/wasm-node" instead.

Here is a minimal reproduction (Codesandbox link):

import { SandpackProvider, SandpackPreview } from "@codesandbox/sandpack-react";

export default function App() {
  return (
    <SandpackProvider
      template="vite"
      customSetup={{
        devDependencies: {
          vite: "^5"
        },
      }}
    >
      <SandpackPreview />
    </SandpackProvider>
  );
}

The error message indicates that we should use @rollup/wasm-node to replace rollup, which is documented in the Rollup 4 changelog. But since Rollup is an internal dependency of Vite, we should be able to use a npm "override" like this sample. The problem is that this workaround doesn't work in the sandpack depedency resolver.

import {
  SandpackProvider,
  SandpackPreview,
} from "@codesandbox/sandpack-react";

export function App() {
  return <SandpackProvider
    template="vite"
    files={{
      'package.json': `{
  "name": "vite-template",
  "version": "0.1.0",
  "private": true,
  "type": "module",
  "scripts": {
    "dev": "vite"
  },
  "dependencies": {
    "@vitejs/plugin-react": "^4.3.1",
    "react": "^18",
    "react-dom": "^18",
    "vite": "^5",
    "@rollup/wasm-node": "4.22.5"
  },
  "overrides": {
    "rollup": "npm:@rollup/wasm-node"
  }
}
  `,
  }
  >
    <SandpackPreview />
  </SandpackProvider >
}

Packages affected

• sandpack-client
• sandpack-react

Description of the problem