flow: Vaadin frontend build fails since RC3 with a Module not found: Error: Can't resolve '@vaadin/vaadin-grid/src/vaadin-grid-column.js

Everything was running fine with RC2, but now with RC3 my build is broken. The messages show some very odd things regarding frontend packages.

Vaadin version: 14.0.0.rc3 Java version: 1.8 OS version: Debian 9

[INFO] --- vaadin-maven-plugin:14.0.0.rc2:build-frontend (default) @ technology.<removed path> ---
[INFO] Scanning classes to find frontend configurations and dependencies...
[INFO] took 2316 ms.
[INFO] Added "@vaadin/vaadin-grid": "5.4.6" line.
[INFO] Added "@vaadin/vaadin-icons": "4.3.1" line.
[INFO] Added "@vaadin/vaadin-split-layout": "4.1.1" line.
[INFO] Added "@vaadin/vaadin-combo-box": "5.0.3" line.
[INFO] Added "@vaadin/vaadin-core-shrinkwrap": "14.0.0-rc3" line.
[INFO] Added "@vaadin/vaadin-upload": "4.2.2" line.
[INFO] Added "@vaadin/vaadin-dialog": "2.2.1" line.
[INFO] Added "@vaadin/vaadin-select": "2.1.5" line.
[INFO] Added "@vaadin/vaadin-app-layout": "2.0.2" line.
[INFO] Added "@vaadin/vaadin-item": "2.1.0" line.
[INFO] Added "@vaadin/vaadin-notification": "1.4.0" line.
[INFO] Added "@vaadin/vaadin-progress-bar": "1.1.2" line.
[INFO] Added "@vaadin/vaadin-ordered-layout": "1.1.0" line.
[INFO] Added "@vaadin/vaadin-login": "1.0.1" line.
[INFO] Added "@vaadin/vaadin-button": "2.2.0" line.
[INFO] Added "@vaadin/vaadin-date-picker": "4.0.2" line.
[INFO] Added "@vaadin/vaadin-menu-bar": "1.0.3" line.
[INFO] Added "@vaadin/vaadin-text-field": "2.4.7" line.
[INFO] Added "@vaadin/vaadin-custom-field": "1.0.6" line.
[INFO] Added "@vaadin/vaadin-form-layout": "2.1.4" line.
[INFO] Added "@vaadin/vaadin-accordion": "1.0.1" line.
[INFO] Added "@polymer/iron-list": "3.0.2" line.
[INFO] Added "@vaadin/vaadin-list-box": "1.1.1" line.
[INFO] Added "@vaadin/vaadin-checkbox": "2.2.10" line.
[INFO] Added "@vaadin/vaadin-details": "1.0.1" line.
[INFO] Added "@polymer/iron-icon": "3.0.1" line.
[INFO] Added "@vaadin/vaadin-time-picker": "2.0.1" line.
[INFO] Added "@vaadin/vaadin-context-menu": "4.3.11" line.
[INFO] Added "@vaadin/vaadin-radio-button": "1.2.3" line.
[INFO] Added "@vaadin/vaadin-tabs": "3.0.4" line.
[INFO] Added "@vaadin/vaadin-lumo-styles": "1.5.0" line.
[INFO] Added "@vaadin/vaadin-material-styles": "1.2.3" line.
[INFO] Updated npm /home/gitlab-runner/builds/54896b10/0/technology/<removed path>/frontend/package.json.
[INFO] Running `npm install` ...

> @vaadin/vaadin-usage-statistics@2.0.4 postinstall /home/gitlab-runner/builds/54896b10/0/technology/<removed path>/frontend/node_modules/@vaadin/vaadin-core-shrinkwrap/node_modules/@vaadin/vaadin-usage-statistics
> node check.js


    Vaadin collects development time usage statistics to improve this product. To opt-out, either run:
    npm explore @vaadin/vaadin-usage-statistics -- npm run disable
    to store disable statistics for the machine, or add
    "vaadin": { "disableUsageStatistics": true }
    to the project package.json and re-run npm install to disable statistics for the project.

    For more details, see https://github.com/vaadin/vaadin-usage-statistics
  

> @vaadin/vaadin-usage-statistics@2.0.4 postinstall /home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/@vaadin/vaadin-usage-statistics
> node check.js


    Vaadin collects development time usage statistics to improve this product. To opt-out, either run:
    npm explore @vaadin/vaadin-usage-statistics -- npm run disable
    to store disable statistics for the machine, or add
    "vaadin": { "disableUsageStatistics": true }
    to the project package.json and re-run npm install to disable statistics for the project.

    For more details, see https://github.com/vaadin/vaadin-usage-statistics
  

> core-js@2.6.9 postinstall /home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/core-js
> node scripts/postinstall || echo "ignore"


> core-js-pure@3.1.4 postinstall /home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/core-js-pure
> node scripts/postinstall || echo "ignore"

npm WARN no-name@ No description
npm WARN no-name@ No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

added 813 packages from 389 contributors and audited 17337 packages in 12.375s
found 0 vulnerabilities

[INFO] package.json updated and npm dependencies installed. 
[WARNING] Use the './' prefix for files in JAR files: 'flow-component-renderer.js', please update your component.
[INFO] 

  Failed to find the following imports in the `node_modules` tree:
      ➜ @vaadin/vaadin-grid/src/vaadin-grid-column.js
       ➜ @vaadin/vaadin-grid/src/vaadin-grid-tree-toggle.js
       ➜ @vaadin/vaadin-grid/src/vaadin-grid.js
       ➜ @vaadin/vaadin-grid/src/vaadin-grid-column-group.js
       ➜ @vaadin/vaadin-grid/src/vaadin-grid-sorter.js
  If the build fails, check that npm packages are installed.

[INFO] Updated /home/gitlab-runner/builds/54896b10/0/technology/<removed path>/target/frontend/generated-flow-imports.js
[INFO] Running webpack ...
Hash: da3c02b3b2484465d82e
Version: webpack 4.30.0
Time: 18673ms
Built at: 2019-07-08 10:24:32 AM
 1 asset
Entrypoint bundle =
Entrypoint bundle.es5 = build/vaadin-bundle.es5-f232e475a319f6fb1347.cache.js
[26] ../target/frontend/generated-flow-imports.js?babel-target=es5 + 205 modules 1.87 MiB {1} [built]
     | ../target/frontend/generated-flow-imports.js?babel-target=es5 2.3 KiB [built]
     |     + 205 hidden modules
[27] ../target/frontend/generated-flow-imports.js?babel-target=es6 + 205 modules 1.56 MiB {0} [built]
     | ../target/frontend/generated-flow-imports.js?babel-target=es6 2.31 KiB [built]
     |     + 205 hidden modules
    + 26 hidden modules

ERROR in ../node_modules/@vaadin/flow-frontend/vaadin-grid-flow-selection-column.js?babel-target=es5
Module not found: Error: Can't resolve '@vaadin/vaadin-grid/src/vaadin-grid-column.js?babel-target=es5' in '/home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/@vaadin/flow-frontend'
 @ ../node_modules/@vaadin/flow-frontend/vaadin-grid-flow-selection-column.js?babel-target=es5 22:0-82 166:4-21
 @ ../target/frontend/generated-flow-imports.js?babel-target=es5

ERROR in ../node_modules/@vaadin/flow-frontend/vaadin-grid-flow-selection-column.js?babel-target=es6
Module not found: Error: Can't resolve '@vaadin/vaadin-grid/src/vaadin-grid-column.js?babel-target=es6' in '/home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/@vaadin/flow-frontend'
 @ ../node_modules/@vaadin/flow-frontend/vaadin-grid-flow-selection-column.js?babel-target=es6 3:0-82 5:47-64
 @ ../target/frontend/generated-flow-imports.js?babel-target=es6

ERROR in ../node_modules/@vaadin/flow-frontend/gridConnector-es6.js?babel-target=es5
Module not found: Error: Can't resolve '@vaadin/vaadin-grid/src/vaadin-grid-data-provider-mixin.js?babel-target=es5' in '/home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/@vaadin/flow-frontend'
 @ ../node_modules/@vaadin/flow-frontend/gridConnector-es6.js?babel-target=es5 4:0-87 10:38-47
 @ ../target/frontend/generated-flow-imports.js?babel-target=es5

ERROR in ../node_modules/@vaadin/flow-frontend/gridConnector-es6.js?babel-target=es6
Module not found: Error: Can't resolve '@vaadin/vaadin-grid/src/vaadin-grid-data-provider-mixin.js?babel-target=es6' in '/home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/@vaadin/flow-frontend'
 @ ../node_modules/@vaadin/flow-frontend/gridConnector-es6.js?babel-target=es6 4:0-87 10:38-47
 @ ../target/frontend/generated-flow-imports.js?babel-target=es6

ERROR in ../node_modules/@vaadin/flow-frontend/gridConnector-es6.js?babel-target=es5
Module not found: Error: Can't resolve '@vaadin/vaadin-grid/src/vaadin-grid.js?babel-target=es5' in '/home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/@vaadin/flow-frontend'
 @ ../node_modules/@vaadin/flow-frontend/gridConnector-es6.js?babel-target=es5 3:0-69 9:40-51
 @ ../target/frontend/generated-flow-imports.js?babel-target=es5

ERROR in ../node_modules/@vaadin/flow-frontend/gridConnector-es6.js?babel-target=es6
Module not found: Error: Can't resolve '@vaadin/vaadin-grid/src/vaadin-grid.js?babel-target=es6' in '/home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/@vaadin/flow-frontend'
 @ ../node_modules/@vaadin/flow-frontend/gridConnector-es6.js?babel-target=es6 3:0-69 9:40-51
 @ ../target/frontend/generated-flow-imports.js?babel-target=es6

ERROR in ../node_modules/@vaadin/flow-frontend/vaadin-grid-flow-selection-column.js?babel-target=es5
Module not found: Error: Can't resolve '@vaadin/vaadin-grid/vaadin-grid-column.js?babel-target=es5' in '/home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/@vaadin/flow-frontend'
 @ ../node_modules/@vaadin/flow-frontend/vaadin-grid-flow-selection-column.js?babel-target=es5 20:0-51
 @ ../target/frontend/generated-flow-imports.js?babel-target=es5

ERROR in ../node_modules/@vaadin/flow-frontend/vaadin-grid-flow-selection-column.js?babel-target=es6
Module not found: Error: Can't resolve '@vaadin/vaadin-grid/vaadin-grid-column.js?babel-target=es6' in '/home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/@vaadin/flow-frontend'
 @ ../node_modules/@vaadin/flow-frontend/vaadin-grid-flow-selection-column.js?babel-target=es6 1:0-51
 @ ../target/frontend/generated-flow-imports.js?babel-target=es6

ERROR in chunk bundle [entry]
build/vaadin-bundle-310716925d76ca50df68.cache.js
/home/gitlab-runner/builds/54896b10/0/technology/<removed path>/node_modules/babel-loader/lib/index.js??ref--4-0!/home/gitlab-runner/builds/54896b10/0/technology/<removed path>/target/frontend/generated-flow-imports.js?babel-target=es6 0776d59bffaeeba26cd4477a9e49fb1e
Unexpected token (7:47)
| 
| {
|   class GridFlowSelectionColumnElement extends !(function webpackMissingModule() { var e = new Error("Cannot find module '@vaadin/vaadin-grid/src/vaadin-grid-column.js?babel-target=es6'"); e.code = 'MODULE_NOT_FOUND'; throw e; }()) {
|     static get template() {
|       return __WEBPACK_MODULE_REFERENCE__21_68746d6c__`

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 4
  • Comments: 17 (3 by maintainers)

Most upvoted comments

I was able to fix this issue by removing:

  • target
  • node_modules
  • package.json
  • package-lock.json
  • webpack.config.js
  • webpack.generated.js

Then I followed it up by a clean install -> Issue solved.

I think this has to do with an old version of @vaadin/vaadin-grid in the package-lock.json which is for some reason not updated by the vaadin-maven-plugin. This causes the webpack to fail since it uses an older version of @vaadin/vaadin-grid for complication then required.

No guarantee for the following but this will apply the mentioned steps on every Maven clean. Since the vaadin-maven-plugin reinitializes the deleted files on install, always execute a clean install:

<plugin>
    <artifactId>maven-clean-plugin</artifactId>
    <version>3.1.0</version>
    <configuration>
        <filesets>
            <fileset>
                <directory>.</directory>
                <includes>
                    <include>package.json</include>
                    <include>package-lock.json</include>
                    <include>webpack.config.js</include>
                    <include>webpack.generated.js</include>
                </includes>
                <followSymlinks>false</followSymlinks>
            </fileset>
            <fileset>
                <directory>./node_modules</directory>
                <includes>
                    <include>**/**</include>
                </includes>
                <followSymlinks>false</followSymlinks>
            </fileset>
        </filesets>
    </configuration>
</plugin>

On startup of the Vaadin application npm install be be done automatically.

Somehow, the error occurs sometimes. To solve the problem, @appreciated steps could be followed. Nevertheless, the application start could not work. Then, npm install should be run manually after mvn clean install.

Steps:

  1. Delete target, node_modules and package-lock.json
  2. Run mvn clean install (Gradle need clean build)
  3. Run npm install