windmill
windmill copied to clipboard
windmill-labs
bug: npm run build raise error
Describe the bug
npm run build
> [email protected] build
> vite build
11:24:32 [vite-plugin-svelte] WARNING: The following packages have a svelte field in their package.json but no exports condition for svelte.
[email protected]
[email protected]
@rgossiaux/[email protected]
[email protected]
[email protected]
Please see https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/faq.md#missing-exports-condition for details.
vite v5.4.0 building SSR bundle for production...
[plugin:vite:dynamic-import-vars] [plugin vite:dynamic-import-vars] src/routes/(root)/(logged)/apps/get_raw/[version]/[...path]/+page.svelte: invalid import "/api/w/${$workspaceStore}/raw_apps/get_data/${$page.params.version}/${$page.params.path}". Variable absolute imports are not supported, imports must start with ./ in the static part of the import. For example: import(`./foo/${bar}.js`).
transforming (176) src/lib/components/table/Cell.svelte11:24:35 [vite-plugin-svelte] /Users/x/Documents/windmill/frontend/src/lib/components/schema/EditableSchemaWrapper.svelte:119:4 A11y: Avoid using autofocus
117: {:else}
118: <input
119: autofocus={true}
^
120: bind:value={formatExtension}
121: class="!h-[32px] py-1 !text-xs !w-64"
transforming (260) src/lib/components/Dev.svelte
warn - The `@variants` directive has been deprecated in Tailwind CSS v3.0.
warn - Use `@layer utilities` or `@layer components` instead.
warn - https://tailwindcss.com/docs/upgrade-guide#replace-variants-with-layer
transforming (350) node_modules/lucide-svelte/dist/svelte/icons/annoyed.svelte11:24:41 [vite-plugin-svelte] /Users/x/Documents/windmill/frontend/node_modules/simple-svelte-autocomplete/src/SimpleAutocomplete.svelte:1149:14 A11y: <span> with click, keypress handlers must have an ARIA role
1147: <div class="tags has-addons">
1148: <span class="tag">{safeLabelFunction(tagItem)}</span>
1149: <span
^
1150: class="tag is-delete"
1151: on:click|preventDefault={unselectItem(tagItem)}
11:24:41 [vite-plugin-svelte] /Users/x/Documents/windmill/frontend/node_modules/simple-svelte-autocomplete/src/SimpleAutocomplete.svelte:1136:8 A11y: <div> with dragstart, dragover, dragleave, drop handlers must have an ARIA role
1134: {#if multiple && hasSelection}
1135: {#each selectedItem as tagItem, i (valueFunction(tagItem, true))}
1136: <div
^
1137: draggable={true}
1138: animate:flip={{ duration: 200 }}
11:24:41 [vite-plugin-svelte] /Users/x/Documents/windmill/frontend/node_modules/simple-svelte-autocomplete/src/SimpleAutocomplete.svelte:1186:6 A11y: <span> with click, keypress handlers must have an ARIA role
1184: />
1185: {#if clearable}
1186: <span
^
1187: on:click={clear}
1188: on:keypress={(e) => {e.key == "Enter" && clear()}}
11:24:41 [vite-plugin-svelte] /Users/x/Documents/windmill/frontend/node_modules/simple-svelte-autocomplete/src/SimpleAutocomplete.svelte:1203:10 A11y: <div> with click, keypress handlers must have an ARIA role
1201: {#each filteredListItems as listItem, i}
1202: {#if listItem && (maxItemsToShowInList <= 0 || i < maxItemsToShowInList)}
1203: <div
^
1204: class="autocomplete-list-item"
1205: class:selected={i === highlightIndex}
11:24:41 [vite-plugin-svelte] /Users/x/Documents/windmill/frontend/node_modules/simple-svelte-autocomplete/src/SimpleAutocomplete.svelte:1243:6 A11y: <div> with click, keypress handlers must have an ARIA role
1241: </div>
1242: {:else if create}
1243: <div
^
1244: class="autocomplete-list-item-create"
1245: on:click={selectItem}
✓ 2333 modules transformed.
x Build failed in 15.27s
error during build:
src/lib/gen/services.gen.ts (10:0): Using the export keyword between a decorator and a class is not allowed. Please use `export @dec class` instead. (Note that you need plugins to import files that are not JavaScript)
file: /Users/x/Documents/windmill/frontend/src/lib/gen/services.gen.ts:10:0
8: import type { BackendVersionResponse, BackendUptodateResponse, GetLicenseIdResponse, GetOpenApiYamlResponse, GetAudit...
9:
10: @Injectable({
^
11: providedIn: 'root'
12: })
RollupError: Using the export keyword between a decorator and a class is not allowed. Please use `export @dec class` instead.
at getRollupError (file:///Users/x/Documents/windmill/frontend/node_modules/rollup/dist/es/shared/parseAst.js:392:41)
at ParseError.initialise (file:///Users/x/Documents/windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:11485:28)
at convertNode (file:///Users/x/Documents/windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:13181:10)
at convertProgram (file:///Users/x/Documents/windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:12525:12)
at Module.setSource (file:///Users/x/Documents/windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:14346:24)
at async ModuleLoader.addModuleSource (file:///Users/x/Documents/windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:19003:13)
To reproduce
- Go to 'frontend'
- run 'npm run build'
- See error
Expected behavior
npm run build success
Screenshots
Browser information
chrome 129.0.6668.100
Application version
1.406.0
Additional Context
No response
Hello. Where is the @Injectable({ code? No search results. I'm investigating the same error I have with latest SvelteKit which uses Vite and Rollup.
Hello. Where is the
@Injectable({code? No search results. I'm investigating the same error I have with latest SvelteKit which uses Vite and Rollup.
The @injectable code is generated after running : npm run generate-backend-client
I also have same issue while running npm run build in frontend on 9 Nov 24 right now.
@ubayzuhdan Yep, was able to reproduce it like so:
git clone [email protected]:windmill-labs/windmill.git
cd windmill/frontend/
git checkout e4583e9b2366b90f31eb015c4dfc21f07b0bc31e # commit at time of writing
npm clean-install
npm run generate-backend-client
npm run build # error
Here's the full output:
❯ cd windmill/frontend/
❯ npm ci
added 1099 packages, and audited 1101 packages in 57s
215 packages are looking for funding
run `npm fund` for details
14 vulnerabilities (3 low, 4 moderate, 7 high)
To address issues that do not require attention, run:
npm audit fix
To address all issues (including breaking changes), run:
npm audit fix --force
Run `npm audit` for details.
❯ npm run generate-backend-client
> [email protected] generate-backend-client
> openapi-ts --input ../backend/windmill-api/openapi.yaml --output ./src/lib/gen --useOptions --enums javascript --format false
✨ Creating Angular client
⚠️ Dependencies used in generated client are missing: @angular/common @angular/core rxjs
✨ Done! Your client is located in: /Users/trusktr/src/windmill-labs+windmill/frontend/src/lib/gen
❯ npm run build
> [email protected] build
> vite build
5:12:33 PM [vite-plugin-svelte] WARNING: The following packages have a svelte field in their package.json but no exports condition for svelte.
[email protected]
[email protected]
@rgossiaux/[email protected]
[email protected]
[email protected]
Please see https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/faq.md#missing-exports-condition for details.
vite v5.4.0 building SSR bundle for production...
[plugin:vite:dynamic-import-vars] [plugin vite:dynamic-import-vars] src/routes/(root)/(logged)/apps/get_raw/[version]/[...path]/+page.svelte: invalid import "/api/w/${$workspaceStore}/raw_apps/get_data/${$page.params.version}/${$page.params.path}". Variable absolute imports are not supported, imports must start with ./ in the static part of the import. For example: import(`./foo/${bar}.js`).
transforming (118) src/lib/components/apps/editor/AppPreview.svelte5:12:36 PM [vite-plugin-svelte] /Users/trusktr/src/windmill-labs+windmill/frontend/src/routes/(root)/(logged)/service_logs/+page.svelte:37:4 A11y: Avoid using autofocus
35: bind:value={searchTerm}
36: autocomplete="off"
37: autofocus
^
38: />
39: {#if searchTerm !== '' && queryParseErrors && queryParseErrors.length > 0}
transforming (197) src/lib/components/Toggle.svelte5:12:37 PM [vite-plugin-svelte] /Users/trusktr/src/windmill-labs+windmill/frontend/src/lib/components/schema/EditableSchemaWrapper.svelte:119:4 A11y: Avoid using autofocus
117: {:else}
118: <input
119: autofocus={true}
^
120: bind:value={formatExtension}
121: class="!h-[32px] py-1 !text-xs !w-64"
transforming (265) src/lib/components/common/tabs/Tab.svelte
warn - The `@variants` directive has been deprecated in Tailwind CSS v3.0.
warn - Use `@layer utilities` or `@layer components` instead.
warn - https://tailwindcss.com/docs/upgrade-guide#replace-variants-with-layer
transforming (347) node_modules/@sveltejs/kit/src/runtime/server/data/index.js5:12:42 PM [vite-plugin-svelte] /Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/simple-svelte-autocomplete/src/SimpleAutocomplete.svelte:1149:14 A11y: <span> with click, keypress handlers must have an ARIA role
1147: <div class="tags has-addons">
1148: <span class="tag">{safeLabelFunction(tagItem)}</span>
1149: <span
^
1150: class="tag is-delete"
1151: on:click|preventDefault={unselectItem(tagItem)}
5:12:42 PM [vite-plugin-svelte] /Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/simple-svelte-autocomplete/src/SimpleAutocomplete.svelte:1136:8 A11y: <div> with dragstart, dragover, dragleave, drop handlers must have an ARIA role
1134: {#if multiple && hasSelection}
1135: {#each selectedItem as tagItem, i (valueFunction(tagItem, true))}
1136: <div
^
1137: draggable={true}
1138: animate:flip={{ duration: 200 }}
5:12:42 PM [vite-plugin-svelte] /Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/simple-svelte-autocomplete/src/SimpleAutocomplete.svelte:1186:6 A11y: <span> with click, keypress handlers must have an ARIA role
1184: />
1185: {#if clearable}
1186: <span
^
1187: on:click={clear}
1188: on:keypress={(e) => {e.key == "Enter" && clear()}}
5:12:42 PM [vite-plugin-svelte] /Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/simple-svelte-autocomplete/src/SimpleAutocomplete.svelte:1203:10 A11y: <div> with click, keypress handlers must have an ARIA role
1201: {#each filteredListItems as listItem, i}
1202: {#if listItem && (maxItemsToShowInList <= 0 || i < maxItemsToShowInList)}
1203: <div
^
1204: class="autocomplete-list-item"
1205: class:selected={i === highlightIndex}
5:12:42 PM [vite-plugin-svelte] /Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/simple-svelte-autocomplete/src/SimpleAutocomplete.svelte:1243:6 A11y: <div> with click, keypress handlers must have an ARIA role
1241: </div>
1242: {:else if create}
1243: <div
^
1244: class="autocomplete-list-item-create"
1245: on:click={selectItem}
transforming (692) src/lib/components/FlowPreviewContent.svelte5:12:44 PM [vite-plugin-svelte] /Users/trusktr/src/windmill-labs+windmill/frontend/src/lib/components/flows/content/FlowSettings.svelte:415:10 A11y: Avoid using autofocus
413: <input
414: type="text"
415: autofocus
^
416: disabled={!$enterpriseLicense}
417: bind:value={$flowStore.value.concurrency_key}
✓ 1008 modules transformed.
x Build failed in 10.48s
error during build:
src/lib/gen/services.gen.ts (10:0): Using the export keyword between a decorator and a class is not allowed. Please use `export @dec class` instead. (Note that you need plugins to import files that are not JavaScript)
file: /Users/trusktr/src/windmill-labs+windmill/frontend/src/lib/gen/services.gen.ts:10:0
8: import type { BackendVersionResponse, BackendUptodateResponse, GetLicenseIdResponse, GetOpenApiYamlResponse, GetAudit...
9:
10: @Injectable({
^
11: providedIn: 'root'
12: })
RollupError: Using the export keyword between a decorator and a class is not allowed. Please use `export @dec class` instead.
at getRollupError (file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/rollup/dist/es/shared/parseAst.js:392:41)
at ParseError.initialise (file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:11485:28)
at convertNode (file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:13181:10)
at convertProgram (file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:12525:12)
at Module.setSource (file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:14346:24)
at async ModuleLoader.addModuleSource (file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:19003:13)
Looks like the same error I have here:
- https://github.com/sveltejs/svelte/issues/14139
Ah yeah, as in the linked issue, I can verify that the error is the same even if we convert all instances of code like this,
@Injectable({
providedIn: 'root'
})
export class SettingsService {
to this (which should be valid),
export
@Injectable({
providedIn: 'root'
})
class SettingsService {
I can then confirm that if we change the format to the following, the npm run build script will get past the decorator issue, but it will have an error on missing Angular dependencies:
export {SettingsService}; // Workaround: use an entirely separate statement for the export
@Injectable({
providedIn: 'root'
})
class SettingsService {
After making that change (manually) to the generated service files, now I get the Angular missing error:
Missing angular error:
error during build:
[vite]: Rollup failed to resolve import "@angular/core" from "/Users/trusktr/src/windmill-labs+windmill/frontend/src/lib/gen/services.gen.ts".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`
at viteWarn (file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:65463:17)
at onRollupWarning (file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:65495:5)
at onwarn (file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:65158:7)
at file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:18625:13
at Object.logger [as onLog] (file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:20280:9)
at ModuleLoader.handleInvalidResolvedId (file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:19215:26)
at file:///Users/trusktr/src/windmill-labs+windmill/frontend/node_modules/rollup/dist/es/shared/node-entry.js:19173:26
I am willing to bet that if we add the missing @angular/core dependency, then npm run build will work, but npm run dev will not, just as is happening to me in https://github.com/sveltejs/svelte/issues/14139.
EDIT: After installing missing Angular dependencies (@angular/core and @angular/common), I now get this error:
src/lib/components/apps/components/display/dbtable/AppDbExplorer.svelte (41:10): "CancelablePromise" is not exported by "src/lib/gen/index.ts", imported by "src/lib/components/apps/components/display/dbtable/AppDbExplorer.svelte".
So even if decorator build issue is solved, the code that is importing the generated services is wrong (probably outdated, I'm guessing a previous version of the services exported CancelablePromise).
Ok I finally found out, to properly solve all decorator build issue, make sure to set target in vite.config.js like so:
- https://github.com/vitejs/vite/issues/18693#issuecomment-2481855364
As for the other issues, Angular deps need to be added, and the code that depends on the services needs to be adjusted.