feat: add compatibility with Vite 6 Environment API

biome.json

@@ -1,7 +1,7 @@
 {
   "$schema": "./node_modules/@biomejs/biome/configuration_schema.json",
   "files": {
-    "ignore": ["dist/", "package.json"]
+    "ignore": ["dist/", "package.json", ".vercel/"]
   },
   "formatter": {
     "indentWidth": 2,

test/environment-api/.gitignore

@@ -0,0 +1,2 @@
+/node_modules/
+/dist/

test/environment-api/.testCiJob.json

@@ -0,0 +1 @@
+{ "name": "Unit Tests E2E" }

test/environment-api/package.json

@@ -0,0 +1,16 @@
+{
+  "scripts": {
+    "dev": "vike dev",
+    "build": "vike build"
+  },
+  "dependencies": {
+    "@types/react": "^18.0.8",
+    "@vitejs/plugin-react": "^4.3.4",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "vike": "0.4.220",
+    "vike-react": "^0.5.12",
+    "vite": "^6.0.5"
+  },
+  "type": "module"
+}

test/environment-api/pages/+config.js

@@ -0,0 +1,2 @@
+import vikeReact from 'vike-react/config'
+export default { viteEnvironmentAPI: true, prerender: true, extends: vikeReact }

test/environment-api/pages/index/+Page.jsx

@@ -0,0 +1,13 @@
+export default Page
+
+import React from 'react'
+import { Counter } from './Counter.jsx'
+
+function Page() {
+  return (
+    <>
+      <h1>Test page</h1>
+      <Counter />
+    </>
+  )
+}

test/environment-api/pages/index/Counter.jsx

@@ -0,0 +1,9 @@
+import React, { useState } from 'react'
+
+export { Counter }
+
+function Counter() {
+  const [count, setCount] = useState(0)
+
+  return <button onClick={() => setCount((count) => count + 1)}>Counter {count}</button>
+}

test/environment-api/test-build.spec.ts

@@ -0,0 +1,20 @@
+import { build } from 'vike/api'
+import { describe, expect, test } from 'vitest'
+
+describe('build', () => {
+  test('prevented', { timeout: 20 * 1000 }, async () => {
+    await buildApp()
+    expect('success').toBe('success')
+  })
+})
+
+async function buildApp() {
+  process.env.NODE_ENV = 'production'
+  await build({
+    viteConfig: {
+      logLevel: 'warn',
+      root: __dirname,
+      configFile: __dirname + '/vite.config.js'
+    }
+  })
+}

test/environment-api/test-dev.test.ts

@@ -0,0 +1,10 @@
+import { expect, getServerUrl, page, run, test } from '@brillout/test-e2e'
+import { testCounter } from '../../test/utils'
+
+run('npm run dev', { doNotFailOnWarning: true })
+
+test('forbidden import', async () => {
+  await page.goto(getServerUrl() + '/')
+  await testCounter()
+  expect('success').toBe('success')
+})

test/environment-api/vite.config.js

@@ -0,0 +1,3 @@
+import react from '@vitejs/plugin-react'
+import vike from 'vike/plugin'
+export default { plugins: [react(), vike()] }

vike/node/api/build.ts

@@ -1,34 +1,42 @@
 export { build }
 
 import { prepareViteApiCall } from './prepareViteApiCall.js'
-import { build as buildVite } from 'vite'
+import { build as buildVite, version } from 'vite'
 import type { APIOptions } from './types.js'
 import assert from 'assert'
 import { isVikeCli } from '../cli/context.js'
 import { isPrerendering } from '../prerender/context.js'
+import { assertVersion } from './utils.js'
 
 /**
  * Programmatically trigger `$ vike build`
  *
  * https://vike.dev/api#build
  */
 async function build(options: APIOptions = {}): Promise<{}> {
-  const { viteConfigEnhanced } = await prepareViteApiCall(options.viteConfig, 'build')
+  const { viteConfigEnhanced, vikeConfig } = await prepareViteApiCall(options.viteConfig, 'build')
 
   // Pass it to autoFullBuild()
   if (viteConfigEnhanced) viteConfigEnhanced._viteConfigEnhanced = viteConfigEnhanced
 
-  // 1. Build client-side
-  // 2. Build server-side
-  //    > See: https://github.com/vikejs/vike/blob/c6c7533a56b3a16fc43ed644fc5c10c02d0ff375/vike/node/plugin/plugins/autoFullBuild.ts#L90
-  // 3. Pre-render (if enabled)
-  //    > See: https://github.com/vikejs/vike/blob/c6c7533a56b3a16fc43ed644fc5c10c02d0ff375/vike/node/plugin/plugins/autoFullBuild.ts#L98
-  //    > We purposely don't start the pre-rendering in this `build()` function but in a Rollup hook instead.
-  //    > Rationale: https://github.com/vikejs/vike/issues/2123
-  await buildVite(viteConfigEnhanced)
-
-  // When using the Vike CLI with pre-rendering the process is forcefully exited at the end of the buildVite() call above
-  assert(!(isVikeCli() && isPrerendering()))
+  if (vikeConfig.global.config.viteEnvironmentAPI) {
+    assertVersion('Vite', version, '6.0.0')
+    const { createBuilder } = await import('vite')
+    const builder = await createBuilder(viteConfigEnhanced)
+    await builder.buildApp()
+  } else {
+    // This buildVite() call does everything:
+    // 1. Build client-side
+    // 2. Build server-side
+    //    > See: https://github.com/vikejs/vike/blob/c6c7533a56b3a16fc43ed644fc5c10c02d0ff375/vike/node/plugin/plugins/autoFullBuild.ts#L90
+    // 3. Pre-render (if enabled)
+    //    > See: https://github.com/vikejs/vike/blob/c6c7533a56b3a16fc43ed644fc5c10c02d0ff375/vike/node/plugin/plugins/autoFullBuild.ts#L98
+    //    > We purposely don't start the pre-rendering in this `build()` function but in a Rollup hook instead.
+    //    > Rationale: https://github.com/vikejs/vike/issues/2123
+    await buildVite(viteConfigEnhanced)
+    // After pre-rendering, when using the Vike CLI, the process is forcefully exited at the end of the buildVite() call above.
+    if (isVikeCli() && isPrerendering()) assert(false)
+  }
 
   return {
     /* We don't return `viteConfig` because `viteConfigEnhanced` is `InlineConfig` not `ResolvedConfig`

vike/node/api/prepareViteApiCall.ts

@@ -35,6 +35,7 @@ async function enhanceViteConfig(viteConfig: InlineConfig | undefined, operation
   const vikeConfig = await getVikeConfig2(viteInfo.root, operation === 'dev', viteInfo.vikeVitePluginOptions)
   const viteConfigEnhanced = addViteSettingsSetByVikeConfig(viteInfo.viteConfigEnhanced, vikeConfig)
   return {
+    vikeConfig,
     viteConfigEnhanced
   }
 }

vike/node/api/utils.ts

@@ -8,3 +8,4 @@ export * from '../../utils/assert.js'
 export * from '../../utils/getGlobalObject.js'
 export * from '../../utils/path.js'
 export * from '../../utils/isObject.js'
+export * from '../../utils/assertVersion.js'

vike/node/plugin/index.ts

@@ -30,6 +30,7 @@ import { setResolveClientEntriesDev } from '../runtime/renderPage/getPageAssets.
 import { resolveClientEntriesDev } from './shared/resolveClientEntriesDev.js'
 import { workaroundCssModuleHmr } from './plugins/workaroundCssModuleHmr.js'
 import { workaroundVite6HmrRegression } from './plugins/workaroundVite6HmrRegression.js'
+import { buildApp } from './plugins/buildApp.js'
 
 // We don't call this in ./onLoad.ts to avoid a cyclic dependency with utils.ts
 setResolveClientEntriesDev(resolveClientEntriesDev)
@@ -41,6 +42,7 @@ function plugin(vikeVitePluginOptions: VikeVitePluginOptions = {}): any {
     importUserCode(),
     ...devConfig(),
     ...buildConfig(),
+    ...buildApp(),
     previewConfig(),
     ...autoFullBuild(),
     packageJsonFile(),