Error using npm create vite@latest: “require() of ES modules is not supported”

I’m trying to set up a new Vite project using the command:

npm create vite@latest

After confirming to proceed with the installation of [email protected], I get the following error:

(node:58326) Warning: require() of ES modules is not supported.
require() of /Users/username/.npm/_npx/1415fee72ff6294b/node_modules/create-vite/index.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from /Users/username/.npm/_npx/1415fee72ff6294b/node_modules/create-vite/package.json.
/Users/username/.npm/_npx/1415fee72ff6294b/node_modules/create-vite/index.js:3
import './dist/index.mjs'
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at wrapSafe (internal/modules/cjs/loader.js:983:16)
    at Module._compile (internal/modules/cjs/loader.js:1033:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1103:10)
    at Module.load (internal/modules/cjs/loader.js:914:32)
    at Function.Module._load (internal/modules/cjs/loader.js:822:14)
    at Function.Module.runMain (internal/modules/cjs/loader.js:1143:12)
    at internal/main/run_main_module.js:16:11
npm error code 1
npm error path /Users/username
npm error command failed
npm error command sh -c create-vite
npm error A complete log of this run can be found in: /Users/username/.npm/_logs/2024-08-14T02_51_37_222Z-debug-0.log

Package.json:

{
  "name": "project-name",
  "private": true,
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
    "preview": "vite preview"
  },
  "dependencies": {
    "framer-motion": "^10.16.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-icons": "^4.10.1",
    "react-scroll": "^1.8.9"
  },
  "devDependencies": {
    "@types/react": "^18.2.15",
    "@types/react-dom": "^18.2.7",
    "autoprefixer": "^10.4.15",
    "eslint": "^8.45.0",
    "eslint-plugin-react": "^7.32.2",
    "eslint-plugin-react-hooks": "^4.6.0",
    "eslint-plugin-react-refresh": "^0.4.3",
    "postcss": "^8.4.28",
    "tailwindcss": "^3.3.3",
    "vite": "^5.4.0"
  }
}

Steps to Reproduce:
Run npm create vite@latest.
Confirm installation when prompted.

Environment:
Node.js version: v22.6.0
npm version: 10.8.2
Operating System: macOS Sonoma

What I’ve Tried:

• Uninstalled and reinstalled all Node.js-related tools to ensure they were up-to-date.
• Ran brew update to ensure Homebrew and its packages were current.
• Manually updated the versions in package.json to their latest.
• Attempted to revert to CommonJS by removing the “type”: “module” field.
• Deleted node_modules and package-lock.json, then ran npm install.
• Ran npm cache clean --force
• I renamed the file as suggested, but it didn’t resolve the issue.
• I tried to modify the code to use dynamic import() statements instead of require(), but i kept getting the error.
• I removed the “type”: “module” from the package.json in the relevant directories, but this led to other compatibility issues or just flat out did not fix the problem

Question:
How can I resolve this error and successfully create a new Vite project using the latest version? Is there a configuration or workaround needed to avoid these ES module issues? I’ve attached my package.json of a current vite project that I have downloaded as well to show that doesn’t work either.

Any help would be greatly appreciated!