Error "Vite build exited with a non zero status" after upgrading von Vaadin23 / Spring Boot 2.7 to Vaadin24 / Spring Boot 3.2

[MichaelF25]

Description of the bug

I am currently upgrading my rather big maven multi-module app from Vaadin23 with Spring Boot 2.7 to latest Vaadin 24.3.3 with Spring Boot 3.2.1. So far the application starts up fine, but as soon as I try to access the UI, the following error with stack trace is displayed:

com.vaadin.flow.server.ExecutionFailedException: Vite build exited with a non zero status
	at com.vaadin.flow.server.frontend.TaskRunDevBundleBuild.runFrontendBuildTool(TaskRunDevBundleBuild.java:189)
	at com.vaadin.flow.server.frontend.TaskRunDevBundleBuild.execute(TaskRunDevBundleBuild.java:101)
	at com.vaadin.flow.server.frontend.NodeTasks.execute(NodeTasks.java:342)
	at com.vaadin.base.devserver.startup.DevModeInitializer.runNodeTasks(DevModeInitializer.java:354)
	at com.vaadin.base.devserver.startup.DevModeInitializer.lambda$initDevModeHandler$0(DevModeInitializer.java:295)

I've also noticed at application startup following error which is maybe related:

2024-01-16 13:51:33.039 ERROR 1048829 --- [onPool-worker-1] c.v.f.s.frontend.TaskRunDevBundleBuild   : Command `/home/mforstner/.vaadin/node/node /home/mforstner/Documents/dev/bsi/bsi-wws-main-parent/bsi-wws-legacy-parent/bsi-wws-parent/bsi-wws-ui-vaadin_23/node_modules/vite/bin/vite.js build` failed:
vite v5.0.6 building for production...
transforming...
✓ 274 modules transformed.
[commonjs--resolver] Missing "./decorators" specifier in "lit" package
error during build:
Error: Missing "./decorators" specifier in "lit" package
    at e (file:///home/mforstner/Documents/dev/bsi/bsi-wws-main-parent/bsi-wws-legacy-parent/bsi-wws-parent/bsi-wws-ui-vaadin_23/node_modules/vite/dist/node/chunks/dep-YJaePtkC.js:21893:25)
    at n (file:///home/mforstner/Documents/dev/bsi/bsi-wws-main-parent/bsi-wws-legacy-parent/bsi-wws-parent/bsi-wws-ui-vaadin_23/node_modules/vite/dist/node/chunks/dep-YJaePtkC.js:21893:627)
    at o (file:///home/mforstner/Documents/dev/bsi/bsi-wws-main-parent/bsi-wws-legacy-parent/bsi-wws-parent/bsi-wws-ui-vaadin_23/node_modules/vite/dist/node/chunks/dep-YJaePtkC.js:21893:1297)
    at resolveExportsOrImports (file:///home/mforstner/Documents/dev/bsi/bsi-wws-main-parent/bsi-wws-legacy-parent/bsi-wws-parent/bsi-wws-ui-vaadin_23/node_modules/vite/dist/node/chunks/dep-YJaePtkC.js:29146:20)
    at resolveDeepImport (file:///home/mforstner/Documents/dev/bsi/bsi-wws-main-parent/bsi-wws-legacy-parent/bsi-wws-parent/bsi-wws-ui-vaadin_23/node_modules/vite/dist/node/chunks/dep-YJaePtkC.js:29165:31)
    at tryNodeResolve (file:///home/mforstner/Documents/dev/bsi/bsi-wws-main-parent/bsi-wws-legacy-parent/bsi-wws-parent/bsi-wws-ui-vaadin_23/node_modules/vite/dist/node/chunks/dep-YJaePtkC.js:28890:20)
    at Object.resolveId (file:///home/mforstner/Documents/dev/bsi/bsi-wws-main-parent/bsi-wws-legacy-parent/bsi-wws-parent/bsi-wws-ui-vaadin_23/node_modules/vite/dist/node/chunks/dep-YJaePtkC.js:28646:28)
    at file:///home/mforstner/Documents/dev/bsi/bsi-wws-main-parent/bsi-wws-legacy-parent/bsi-wws-parent/bsi-wws-ui-vaadin_23/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:18670:40
    at async PluginDriver.hookFirstAndGetPlugin (file:///home/mforstner/Documents/dev/bsi/bsi-wws-main-parent/bsi-wws-legacy-parent/bsi-wws-parent/bsi-wws-ui-vaadin_23/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:18570:28)
    at async resolveId (file:///home/mforstner/Documents/dev/bsi/bsi-wws-main-parent/bsi-wws-legacy-parent/bsi-wws-parent/bsi-wws-ui-vaadin_23/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:17239:26)

I've also tried to clean everything via mvn clean and mvn vaadin:clean-frontend as well as removing any old node or npm installations without success.

Versions:

- Vaadin / Flow version: 24.3.3
- Java version: 17.0.9
- OS version: Ubuntu Linux 22.04 LTS
- Browser version (if applicable): Latest Chrome
- Application Server (if applicable): Embedded Tomcat in Spring Boot
- IDE (if applicable): IntelliJ IDE 2023.3.2
- Development or production mode: dev mode

[MichaelF25]

Seems like it is related to https://github.com/vaadin/vcf-nav/issues/33

[mshabarov]

@MichaelF25 yeah, that plugin might be a reason. The recommendation is to use SideNav.

Vite version has been changed from 4 to 5 between Vaadin 23 and 24.

This new version of Vite requires decorators like customElement, property to be exported from lit/decorators.js with explicit .js extension.

Your project misses .js somewhere in JS codes in an import, that can be a reason. Or, any of the third-party JS components used in your project have lit/decorators without .js.

Also, please check the browser logs for this kind of message:

Warning: the file ${id} imports from '${decoratorMatch[3]}' when it should import from '${decoratorMatch[3]}.js'

or

Warning: the file ${id} imports from '${directiveMatch[3]}${directiveMatch[4]}' when it should import from '${directiveMatch[3]}${directiveMatch[4]}.js'

See this PR for more insights: https://github.com/vaadin/flow/pull/14449.

[felix-office]

It actually broke in minor version. It's working for me in 24.2.5 and failing in 24.3.3 which is pretty bad behavior for a minor version in my opinion.

vite v5.0.6 building for production...
transforming...
✓ 495 modules transformed.
Expression expected (Note that you need plugins to import files that are not JavaScript)
file: /home/felix/Development/ravc/node_modules/@vaadin-component-factory/vcf-nav/src/vcf-nav.ts:13:0
11: let id = 0;
12: 
13: @customElement('vcf-nav')
    ^
14: export class Nav extends LitElement {
15:   @property({ type: Boolean, reflect: true })
error during build:
RollupError: Expression expected
    at error (file:///home/felix/Development/ravc/node_modules/vite/node_modules/rollup/dist/es/shared/parseAst.js:337:30)
    at parseError (file:///home/felix/Development/ravc/node_modules/vite/node_modules/rollup/dist/es/shared/parseAst.js:972:9)
    at convertNode (file:///home/felix/Development/ravc/node_modules/vite/node_modules/rollup/dist/es/shared/parseAst.js:2061:12)
    at convertProgram (file:///home/felix/Development/ravc/node_modules/vite/node_modules/rollup/dist/es/shared/parseAst.js:965:12)
    at parseAstAsync (file:///home/felix/Development/ravc/node_modules/vite/node_modules/rollup/dist/es/shared/parseAst.js:2112:12)
    at async Module.tryParseAsync (file:///home/felix/Development/ravc/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:13571:20)
    at async Module.setSource (file:///home/felix/Development/ravc/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:13152:35)
    at async ModuleLoader.addModuleSource (file:///home/felix/Development/ravc/node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:17847:13)

[ovsyannykov]

I also encountered this problem when upgrading from 24.3.3 to 24.3.11. The following commands helped me:

mvn clean vaadin:clean-frontend
del /f/s/q package-lock.json package.json tsconfig.json types.d.ts vite.config.ts vite.generated.ts
mvn -DskipTests install
mvn vaadin:build-frontend
mvn spring-boot:run

At the same time, attempts to launch from under the IDE were unsuccessful. It was the first launch from the command line that magically solved the problem! After this, it became possible to work in IDE.

[mcollovati]

Need to be retested against latest Vaadin version

[ovsyannykov]

This time I skipped the step of confirming that the problem was still present and simply ran the script I had prepared earlier. The update was successful from 24.3.11 to 24.4.7. Then I also updated Spring Boot smoothly from 3.2.5 to 3.3.2.