Build fails on a fresh install w react/vite ionic 8

Ionic Framework
1

Hey guys,
Just wanted to checkout ionic 8 because of a upcoming migration but I can`t get it to work.

I just installed ionic 8 freshly and wanted to build the demo app, but it`s not working.

Got this build error by vite. and it`s also reproduce able on other fresh installs.

Tried node 16 to 20 → same results. Using node 18
Tried ionic build, npx vite build → same results

Build error.

ionic build
> vite build
vite v5.3.0 building for production...
✓ 63 modules transformed.
x Build failed in 543ms
error during build:
[commonjs--resolver] node_modules/@ionic/core/components/ion-menu.js (134:78): Expected ',', got '('
file: /Users/tobe/Sites/getucated/app_neu/test/node_modules/@ionic/core/components/ion-menu.js:134:78

132:         menuController._register(this);
133:         this.menuChanged();
134:         this.gesture = (await import('./index3.js')).createGesture({
                                                                         ^
135:             el: document,
136:             gestureName: 'menu-swipe',

RollupError: Expected ',', got '('
    at getRollupError (file:///Users/tobe/Sites/getucated/app_neu/test/node_modules/rollup/dist/es/shared/parseAst.js:396:41)
    at ParseError.initialise (file:///Users/tobe/Sites/getucated/app_neu/test/node_modules/rollup/dist/es/shared/node-entry.js:11332:28)
    at convertNode (file:///Users/tobe/Sites/getucated/app_neu/test/node_modules/rollup/dist/es/shared/node-entry.js:13082:10)
    at convertProgram (file:///Users/tobe/Sites/getucated/app_neu/test/node_modules/rollup/dist/es/shared/node-entry.js:12399:12)
    at Module.setSource (file:///Users/tobe/Sites/getucated/app_neu/test/node_modules/rollup/dist/es/shared/node-entry.js:14246:24)
    at async ModuleLoader.addModuleSource (file:///Users/tobe/Sites/getucated/app_neu/test/node_modules/rollup/dist/es/shared/node-entry.js:18892:13)
[ERROR] An error occurred while running subprocess vite.
        
        vite build exited with exit code 1.
        
        Re-running this command with the --verbose flag may provide more information.

package.json (I`ve updated most of them to @latest, but with the same results)

{
  "name": "test",
  "private": true,
  "version": "0.0.1",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "tsc && vite build",
    "preview": "vite preview",
    "test.e2e": "cypress run",
    "test.unit": "vitest",
    "lint": "eslint"
  },
  "dependencies": {
    "@capacitor/app": "6.0.0",
    "@capacitor/core": "6.1.0",
    "@capacitor/haptics": "6.0.0",
    "@capacitor/keyboard": "6.0.1",
    "@capacitor/status-bar": "6.0.0",
    "@ionic/react": "^8.2.2",
    "@ionic/react-router": "^8.2.2",
    "@types/react-router": "^5.1.20",
    "@types/react-router-dom": "^5.3.3",
    "ionicons": "^7.0.0",
    "react": "^18.3.1",
    "react-dom": "^18.2.0",
    "react-router": "^5.3.4",
    "react-router-dom": "^5.3.4"
  },
  "devDependencies": {
    "@capacitor/cli": "6.1.0",
    "@testing-library/dom": ">=7.21.4",
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^14.0.0",
    "@testing-library/user-event": "^14.4.3",
    "@types/react": "^18.0.27",
    "@types/react-dom": "^18.0.10",
    "@vitejs/plugin-legacy": "^5.0.0",
    "@vitejs/plugin-react": "^4.0.1",
    "cypress": "^13.5.0",
    "eslint": "^9.4.0",
    "eslint-plugin-react": "^7.32.2",
    "jsdom": "^24.1.0",
    "terser": "^5.4.0",
    "typescript": "^5.4.5",
    "vite": "^5.3.0",
    "vitest": "^0.34.6"
  },
  "description": "An Ionic project"
}

Version

ionic --version
7.2.0

Machine

Software:

    System Software Overview:
      System Version: macOS 13.4 (22F66)
      Kernel Version: Darwin 22.5.0

Hardware:
      Model Name: MacBook Pro
      Model Identifier: MacBookPro18,1
      Chip: Apple M1 Pro
      Total Number of Cores: 10 (8 performance and 2 efficiency)
      Memory: 32 GB
2

Looks like a bug in latest version of vite (5.3.0), which was released 4 hours ago.
If I pin 5.2.12 version then it works, give it a try: npm install vite@5.2.12 --save-exact

3

Thanks @julio-ionic, that solved the problem! #

But, you have to re-install vite in that specific version 5.2.11 after installing ionic.

npm i vite@5.2.11

if not, it doesn`t work. package.json says vite 5.0.0 but the compiler runs with 5.3.0. Strange but true.