/ Vaadin Flow Framework

Gradle support for Vaadin 14 now available for PRO subscribers

DS Gradle Vaadin Flow Plugin 1.3 with Javascript module support is now available!

For those of you who haven't followed the Vaadin Flow releases the 14:th release is actually a totally new framework with a totally new client side stack. The whole Vaadin client side stack was re-vamped to be on top of Javascript rather than using HTML templates and the client package manager was changed.

This brought with it a lot of changes.

For the Gradle plugin this meant that the whole client side handling needed to be re-done to support the new way of handling the Polymer 3 Javascript modules. The plugin also needed to start to support the internal details of how Vaadin determines between compatibility mode and the new NPM mode.

A lot also have changed regarding the project structure and plugin usage but many things are still the same. I probably will not be able to answer all the questions here but I'll try to answer the most obvious questions below. If you have more don't hesitate to ask them in the comments section below.

Let's start with the elephant in the room.

Why do you now charge money for the Vaadin 14 support?

With the constant large scale changes done by Vaadin to the framework it is no longer possible to maintain the plugin for free.

A big thank you to Vaadin, the main sponsor, and other sponsors who have been funding the project so far, it has made it possible to make this project for the community.

But I believe the only way Open Source can sustainably work in the long run is that everyone using the software need to pitch in. And that leads me to the new PRO subscriptions.

First off, to avoid confusion, the Devsoap PRO subscription is not tied to, or linked to the Vaadin provided PRO subscription in any way. It is solely a Devsoap service.

Moving forward the PRO subscriptions will allow everyone to only pitch in a little to make a difference. The more people join the effort, the more time I (and maybe others) will be able to pitch in and work on the plugin to bring you new features and maintain the plugin.

This also will make it easier for us to provide money bounties for the Vaadin community to make use of when maintaining the plugin. (Spoiler alert: There is already one bounty available, continue reading to learn more ;) )

How do I take the plugin into use?

If you are using Vaadin 10 - 14 (compatibility mode) you do not need to do anything, you can continue to use the plugin for free by just updating the plugin version to 1.3. Those Vaadin versions will always be free in the future as well.

If you want to take Vaadin 14 (non-compatibility mode) into use you will need a PRO subscription. You can get that from https://devsoap.com/store.

Once you've got the subscription credentials you need to add the following to the build.gradle file:

build.gradle

devsoap {
  email = <your email address you registred with>
  key = <your API key you received via email>
}

Once you got that set the plugin will work in non-compatiblity mode using NPM to resolve the dependencies.

As usual you can include the plugin by using the following in your gradle scripts:

build.gradle

plugins {
  id "com.devsoap.vaadin-flow" version "1.3"
}

For more information checkout the Getting started guide.

Is there any documentation available?

Some of the documentation has been already ported to Vaadin 14 in Devsoap Docs (https://docs.devsoap.com). Most of the new articles are behind the [PRO] tag so to view them you will again need your PRO credentials.

The documentation is an on-going effort and will improve as the plugin will stabilize further.

Is there a migration tool available?

No, not yet.

My suggestion is that if your already have been developing for a while on Vaadin 10-13 and have a large code base just continue using Vaadin 14 in compatibility mode. There is currently nothing you can gain by starting a migration to JS components right now.

For new projects I would suggest going with Vaadin 14. The plugin provides a nice task, vaadinCreateProject that will create the necessery stubs for your new project so you get the classes and resources in the correct folders from the get go.

You can read more about the project creation in this docs article.

What are the known limitations of the release?

Currently the plugin has a few limitations you should be aware of:

  • @Id annotation in Polymer templates is not supported (#285).

    It is unclear why this bug occurs but most likely there is some difference in the handling of the the @Id annotation between the Maven and Gradle plugin.

    To resolve the issue there is now a bug bounty of $100 to the lucky person who manages to solve the mystery. If you want to take a crack at it and help the community (and take your wife or yourself out to dinner) check out the bounty at https://www.bountysource.com/issues/81070527-id-is-not-supported-with-vaadin-14-npm-mode.
  • Limited testing on MacOS.

    This version has so far only been thoroughly tested on Linux and Windows and has received little testing on MacOS. If there are any mac users out there, I would appreciate any feedback you have.
  • No development mode

    The Maven plugin uses a webkit development server in "development mode". In the Gradle plugin the "production mode" has now been deprecated and it will always bundle the sources.

    If you need to develop Javascript components more extensively then separate that code into its own repository and use Javascript tooling to deploy those components to an internal NPM repository and then use @NpmPackage to import that package into the Vaadin application. This is also how Vaadin develops its own components.
    If you feel this is a terrible wrong-doing create a ticket in Github and   state your claims. If it gets enough votes and good arguments I might change my mind about adding a development mode.

That is it for this release, I hope you didn't despair while waiting for NPM support and I do hope to you see you on Github.

I believe there are exciting times ahead for the Vaadin Gradle community!