This is an example project for creating a Java wrapper for an existing Lit component that is available in npm.
The example code integrates @axa-ch/input-text.
If you wish to build and publish an add-on or extension in Vaadin Directory, Vaadin provides the following three template projects:
- vaadin/addon-template: Create a composite component. This Java-only template is the easiest when extending Vaadin Java components.
- vaadin/client-server-addon-template: Build a standalone, client-server TypeScript-Java component. This template provides you with a Lit-based example to start with.
- (this repo) vaadin/npm-addon-template: Wrap a web component from npmjs.com as a Vaadin Java component.
JavaScript modules can either be published as an NPM package or be kept as local
files in your project. The local JavaScript modules should be put in
src/main/resources/META-INF/frontend so that they are automatically found and
used in the using application.
If the modules are published then the package should be noted in the component
using the @NpmPackage annotation in addition to using @JsModule annotation.
Starting the test/demo server:
- Run
mvn jetty:run. - Open http://localhost:8080 in the browser.
You can create the zip package needed for Vaadin Directory using
mvn versions:set -DnewVersion=1.0.0 # You cannot publish snapshot versions
mvn install -Pdirectory
The package is created as target/axa-input-text-1.0.0.zip
For more information or to upload the package, visit https://vaadin.com/directory/my-components?uploadNewComponent