[login] Modules not found

[SebastianBock83]

Description

When building our components with an included @vaadin/vaadin reference with webpack, we are facing two errors with the current vaadin version 24.4.10.

First error is: ERROR in ./node_modules/@vaadin/login/src/vaadin-login-overlay-wrapper-mixin.js 7:0-72 Module not found: Error: Can't resolve '@vaadin/component-base/src/slot-observer' in '[PROJECT_PATH]\node_modules\@vaadin\login\src' Did you mean 'slot-observer.js'? BREAKING CHANGE: The request '@vaadin/component-base/src/slot-observer' failed to resolve only because it was resolved as fully specified (probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"'). The extension in the request is mandatory for it to be fully specified. Add the extension to the request.

Second error is: ERROR in ./node_modules/@vaadin/login/src/vaadin-login-overlay-wrapper-mixin.js 8:0-78 Module not found: Error: Can't resolve '@vaadin/component-base/src/unique-id-utils' in 'C:\kisters\development\web-components\portal-base\node_modules\@vaadin\login\src' Did you mean 'unique-id-utils.js'? BREAKING CHANGE: The request '@vaadin/component-base/src/unique-id-utils' failed to resolve only because it was resolved as fully specified (probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"'). The extension in the request is mandatory for it to be fully specified. Add the extension to the request.

I checked the node_modules/@vaadin/login/src/vaadin-login-overlay-wrapper.js file which imports the scripts and added the .js extension for testing and the build was done successfully.

The imports originally looking like this: import { DirMixin } from '@vaadin/component-base/src/dir-mixin.js'; import { SlotObserver } from '@vaadin/component-base/src/slot-observer'; import { generateUniqueId } from '@vaadin/component-base/src/unique-id-utils'; import { OverlayMixin } from '@vaadin/overlay/src/vaadin-overlay-mixin.js';

so I asume that the extensions were forgotten to add?

Could you please fix this issues in short term, so that our builds can be done without the manually changes?

Expected outcome

The result should be a proper build without the log errors which causes the build to break.

Minimal reproducible example

Because this is no script error, but an infrastructure error, I am not able to provide an example.

A way to reproduce this, would be to use a webpack / vite environment and run a build with an index.js which imports @vaadin/vaadin and see if the error occurs.

Steps to reproduce

1. integrate @vaadin/vaadin into your code
2. run a webpack / vite build
3. see the error message on the build log

Environment

Vaadin version(s): 24.4.10 OS: Windows 10

Browsers

Issue is not browser related

[web-padawan]

Thanks for reporting. Created a PR with a fix: https://github.com/vaadin/web-components/pull/7909

[SebastianBock83]

Cool thanks alot.