Does velite support nextjs 15?

[myudak]

planning to migrate to nextjs 15 rn, also i noticed if i use --turbo in nextjs dev the velite doesnt work?

[zce]

Already supported, refer to the docs for more information

[zce]

https://velite.js.org/guide/with-nextjs#%F0%9F%8E%8A-start-velite-with-next-js-config-%F0%9F%86%95

[Mr-Vipi]

how about the config for next.config.ts file?

[zce]

Is next.config.ts any difference?

[Mr-Vipi]

I want to give a further explanation about my issue:
I already have a project with nextjs 14 and it works ok with the following config under next.config.mjs:

const isDev = process.argv.includes("dev")
const isBuild = process.argv.includes("build")
if (!process.env.VELITE_STARTED && (isDev || isBuild)) {
  process.env.VELITE_STARTED = "1"
  const { build } = await import("velite")
  await build({ watch: isDev, clean: !isDev })
}

/** @type {import('next').NextConfig} */
const nextConfig = { }

export default nextConfig

when I upgrade to version 15 Indeed i can use the same file, but the new convention for the next config is next.config.ts

import type { NextConfig } from "next";

const nextConfig: NextConfig = {
  /* config options here */
};

export default nextConfig;

I change it like this:

import { build } from 'velite'

/** @type {import('next').NextConfig} */
export default {
  // othor next config here...
  webpack: config => {
    config.plugins.push(new VeliteWebpackPlugin())
    return config
  }
}

class VeliteWebpackPlugin {
  static started = false
  apply(/** @type {import('webpack').Compiler} */ compiler) {
    // executed three times in nextjs
    // twice for the server (nodejs / edge runtime) and once for the client
    compiler.hooks.beforeCompile.tapPromise('VeliteWebpackPlugin', async () => {
      if (VeliteWebpackPlugin.started) return
      VeliteWebpackPlugin.started = true
      const dev = compiler.options.mode === 'development'
      await build({ watch: dev, clean: !dev })
    })
  }
}

firstly I have type definition error : Parameter compiler implicitly has an type.

Now when I try to run my app next dev --turbopack I got the following terminal error:

/home/mrgug/my-portfolio/next.config.compiled.js:56
    var build = (await Promise.resolve().then(function() {
                       ^^^^^^^

SyntaxError: Unexpected identifier 'Promise'
    at wrapSafe (node:internal/modules/cjs/loader:1512:18)
    at Module._compile (node:internal/modules/cjs/loader:1534:20)
    at requireFromString (/home/mrgug/my-portfolio/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/build/next-config-ts/require-hook.js:81:7)
    at transpileConfig (/home/mrgug/my-portfolio/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/build/next-config-ts/transpile-config.js:63:51)
    at async loadConfig (/home/mrgug/my-portfolio/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/server/config.js:771:36)
    at async Module.nextDev (/home/mrgug/my-portfolio/node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/next/dist/cli/next-dev.js:190:14)

Node.js v22.13.0
 ELIFECYCLE  Command failed with exit code 1.

Hope I was clear explaining this.

P.S: I think it's an issue with turbopack since I tried with next dev and it happened to work

[zce]

https://velite.js.org/guide/with-nextjs#🎊-start-velite-with-next-js-config-🆕 has been updated