vaadin cannot find module ./theme

Question

My vaadin 23 project has just started generating a error on startup.

DefaultDeploymentConfiguration.java:158) - 
Vaadin is running in DEBUG MODE.
When deploying application for production, remember to disable debug features. See more from https://vaadin.com/docs/
org.apache.coyote.AbstractProtocol start
Starting ProtocolHandler ["http-nio-8080"]
org.apache.catalina.startup.Catalina start
Server startup in [6,702] milliseconds
DevServerOutputTracker.java:110) - [build-status] : Compiled.

----------------- Frontend compiled successfully. -----------------

DefaultDeploymentConfiguration.java:158) - 
Vaadin is running in DEBUG MODE.
When deploying application for production, remember to disable debug features. See more from https://vaadin.com/docs/
org.apache.coyote.AbstractProtocol start
Starting ProtocolHandler ["http-nio-8080"]
org.apache.catalina.startup.Catalina start
Server startup in [6,702] milliseconds
DevServerOutputTracker.java:110) - [build-status] : Compiled.
----------------- Frontend compiled successfully. -----------------

AbstractDevServerRunner.java:223) - Started Webpack. Time: 5777ms
DevServerOutputTracker.java:110) - ERROR in frontend/generated/vaadin.ts:7:28
DevServerOutputTracker.java:110) - TS2307: Cannot find module './theme' or its corresponding type declarations.
DevServerOutputTracker.java:110) -     5 | import '@vaadin/flow-frontend/VaadinDevmodeGizmo.js';
DevServerOutputTracker.java:110) -     6 |
DevServerOutputTracker.java:110) -   > 7 | import { applyTheme } from './theme';
DevServerOutputTracker.java:110) -       |                            ^^^^^^^^^
DevServerOutputTracker.java:110) -     8 | applyTheme(document);
DevServerOutputTracker.java:110) -     9 |
DevServerOutputTracker.java:110) - 
DevServerOutputTracker.java:110) - 
DevServerOutputTracker.java:110) - WARNING in InjectManifest has been called multiple times, perhaps due to running webpack in --watch mode. The precache manifest generated after the first call may be inaccurate! Please see https://github.com/GoogleChrome/workbox/issues/1790 for more information.
DevServerOutputTracker.java:110) - [build-status] 1 warning were reported.
DevServerOutputTracker.java:110) - [build-status] : Compiled.

I've tried deleting my node_modules directory and the target directory followed by a mvn install.

I've also tried upgrading to the last version of vaadin v23.0.11.

Edit: since my original post this error randomly went away.

It has now re-emerged except now I can't actually access the web page due to the following error being displayed:

 Webpack Error Close

ERROR in frontend/generated/vaadin.ts:7:28
TS2307: Cannot find module './theme' or its corresponding type declarations.
    5 | import '@vaadin/flow-frontend/VaadinDevmodeGizmo.js';
    6 |
  > 7 | import { applyTheme } from './theme';
      |                            ^^^^^^^^^
    8 | applyTheme(document);
    9 |


WARNING in InjectManifest has been called multiple times, perhaps due to running webpack in --watch mode. The precache manifest generated after the first call may be inaccurate! Please see https://github.com/GoogleChrome/workbox/issues/1790 for more information.

ERROR in ./generated/index.ts
Module not found: Error: Can't resolve '../../target/frontend/generated-flow-imports' in 'onepub-vaadin/frontend/generated'
 [build-status] 1 error and 1 warning were reported.

score 0 · Answer 1 · answered Jun 16 '22 at 09:37

This is one of those "I've seen it in the past" issues but also one of those "I don't remember what I exactly did to fix it".

There are some potential causes and try to discard the issues one by one:

1- Try to make sure that application.properties doesn't contain any UTF-8 character (basically, no accents and try to assert that all characters are a-z 0-9. I've had a lot of random issues with this.

2- Make sure that the theme exists and the project structure is valid and correct. On the root of your project you should have

frontend > generated (you can delete this one and will be regenerated at next compilation)
frontend > themes > your_theme_name and all the contents and theme.json. your_theme_name should match the text you have annotated with @Theme(value = "your_theme_name") in your SpringBootServletInitializer class.

3 Run maven clean goal (this will delete target directory), then maven compile. Then clean the frontend with maven vaadin:clean-frontend and then compile it vaadin:compile-frontend. If compile succeeds for both java and frontend, try to run the springboot:run goal.

Upgrade to Vaadin 23.1.0 as it's the latest release and retry.

To make sure that the project structure is fine, download a fresh project from Vaadin Start and compare it.

If during the troubleshooting you get another error, post it here as it'll help.

I found the problem. I had renamed the project directory and eclipse was still referencing the old directory name and building done components in that dir. Rebuilt the eclipse workspace and all good. — Brett Sutton, Jun 17 '22 at 08:39

vaadin cannot find module ./theme

1 Answers1