However the web component I am integrating has both a js file and a css file. The document explains to use @JsModule to include the js file, but how do I include the web components .css file?
If I understand Vaadin 14 correctly, and I hope that I don’t, one has to manhandle any vanilla css files you have in your project into some newfangled JsModule in order to use it! I certainly hope there is an easier way of doing this.
PS: So far I have found Vaadin 14 to have too much of a split personality - it can’t decide whether is npm+javascript or maven+java, previous bower packaging and polymer 2 templates was far better.
This will have the same impact as wrapping the css code inside <dom-module id="mytextfield" theme-for="vaadin-textfield"><template><style> ... </style></template></dom-module> html-tags instead of <custom-style><style> ... </style></custom-style> in Vaadin 10
Thanks for the tip - I missed that part of the documentation. However, I still don’t get this to work :-(.
I have created a component called MyComponent into which I want to include bootstrap.css (as a typical example). As I mentioned before, if I include granite-bootstrap it works.
I now tried:
@Tag("my-component")
@NpmPackage(value = "@polymer/paper-input", version = "3.0.2")
@CssImport(value = "./src/bootstrap.css", themeFor = "my-component")
public class MyComponent extends PolymerTemplate<MyComponent.Model> {
...
However this doesn’t work. Am I missing something else?