Different package.json file from vaadinBuildFrontend to run

Description of the bug / feature

I am building a simple application for experimenting styling feature and I am facing a really wired behaviour. The sample application could be found here: https://github.com/foxpluto/testvaadintheme The app is just a Dashboard with few buttons and on the AppShell class I have applied a Style:

@Theme(value = Lumo.class, variant = Lumo.DARK)
@CssImport("./styles/main.css")
public class AppShell implements AppShellConfigurator {

    private static final long serialVersionUID = 5667536054512022404L;

    @Override
    public void configurePage(AppShellSettings settings) {
        // Nothing to add here
    }

}

I am using gradle like building software but this is irrelevant. When I run the command gradle vaadinBuildFrontend the package.json file contain these devDependencies:

  "devDependencies": {
    "compression-webpack-plugin": "4.0.1",
    "webpack-cli": "3.3.11",
    "script-ext-html-webpack-plugin": "2.1.4",
    "validator": "12.0.0",
    "awesome-typescript-loader": "5.2.1",
    "lit-html": "1.2.1",
    "@types/validator": "10.11.3",
    "lit-element": "2.3.1",
    "webpack": "4.42.0",
    "html-webpack-plugin": "3.2.0",
    "chokidar": "^3.4.0",
    "typescript": "3.8.3",
    "webpack-merge": "4.2.2",
    "webpack-dev-server": "3.10.3",
    "css-loader": "4.2.1",
    "lit-css-loader": "0.0.4",
    "extract-loader": "5.1.0",
    "raw-loader": "4.0.0",
    "copy-webpack-plugin": "5.1.1"
  }

but when I run the app with gradle run (or I try to debug the app with the IDE) the package.json file change and some module are missing:

  "devDependencies": {
    "compression-webpack-plugin": "4.0.1",
    "webpack-cli": "3.3.11",
    "script-ext-html-webpack-plugin": "2.1.4",
    "validator": "13.1.17",
    "awesome-typescript-loader": "5.2.1",
    "lit-html": "1.2.1",
    "@types/validator": "13.1.0",
    "lit-element": "2.3.1",
    "webpack": "4.42.0",
    "html-webpack-plugin": "3.2.0",
    "chokidar": "^3.5.0",
    "typescript": "4.0.3",
    "webpack-merge": "4.2.2",
    "webpack-dev-server": "3.11.0",
    "css-loader": "4.2.1",
    "lit-css-loader": "0.0.4",
    "extract-loader": "5.1.0"
  }

Here is a picture with a diff visualization:

As you can easily see the raw-loader is missing which bring to the error:

ERROR in ../target/frontend/generated-flow-imports.js
Module not found: Error: Can't resolve 'raw-loader' in '/Users/fox/Documents/workspace/testvaadintheme/frontend'
 @ ../target/frontend/generated-flow-imports.js 10:0-55 11:36-42
Child html-webpack-plugin for "index.html":
     1 asset
    Entrypoint undefined = index.html
    [../node_modules/.pnpm/registry.npmjs.org/html-webpack-plugin/3.2.0_webpack@4.42.0/node_modules/html-webpack-plugin/lib/loader.js!../target/index.html] 1.13 KiB {0} [built]
    [../node_modules/.pnpm/registry.npmjs.org/lodash/4.17.21/node_modules/lodash/lodash.js] 531 KiB {0} [built]
    [../node_modules/.pnpm/registry.npmjs.org/webpack/4.42.0_webpack@4.42.0/node_modules/webpack/buildin/global.js] 472 bytes {0} [built]
    [../node_modules/.pnpm/registry.npmjs.org/webpack/4.42.0_webpack@4.42.0/node_modules/webpack/buildin/module.js] 497 bytes {0} [built]
ℹ ｢wdm｣: Failed to compile.

------------------ Frontend compilation failed. ------------------

Minimal reproducible example

Try to run gradle run or try to debug this app: https://github.com/foxpluto/testvaadintheme

Expected behavior

The package.json should not change or compilation error should not be raised

Actual behavior

In 18.0.6 including the annotation @CssImport("./styles/main.css") make the application impossible to use or debug.

Versions:

- Vaadin / Flow version: 18.0.6
- Java version: OpenJDK Runtime Environment (build 13.0.2+8)
- OS version: Macos Big Sur 11.2
- Browser version (if applicable): Chrome (not relevant)
- Application Server (if applicable): Jetty 9.4.31.v20200723 (not relevant)
- IDE (if applicable): Visual Studio Code (not relevant)

[foxpluto]

Hi, that dependency is not in use, probably a copy paste error. You can remove it. I am not a maven expert, I will try but I am not sure to correctly port the gradle script to maven in the correct way.

Regards, S.

[caalador]

Tested this with Vaadin 21.0.2 with the same plugin id 'com.vaadin' version '21.0.2' I could not replicate the issue.

Looking at the start situation the plugin used was for Vaadin 17.0.1 (id 'com.vaadin' version '0.17.0.1') where as the actual version used was 18.0.6 so the plugin was building with faulty data when compared to the actual version used when executing.

So to execute a version please use a plugin matching the Vaadin version used as the plugin execution will not use the enforcedPlatform version.

If you get the same problem when using the same plugin and bom versions please open up a new issue with steps to replicate.