com.vaadin.flow.component.dependency.
Annotation Type JavaScript
-
@Retention(RUNTIME) @Target(TYPE) @Inherited @Documented @Repeatable(Container.class) public @interface JavaScript
Defines JavaScript dependencies on a
Component
class. For adding multiple JavaScript files for a single component, you can use this annotation multiple times.It is guaranteed that dependencies will be loaded only once. The files loaded will be in the same order as the annotations were on the class. However, loading order is only guaranteed on a class level; Annotations from different classes may appear in different order, grouped by the annotated class. Also, files identified by
@JavaScript
will be loaded afterJsModule
and beforeCssImport
.NOTE: Currently all frontend resources are bundled together into one big bundle. This means, that JavaScript files loaded by one class will be present on a view constructed by another class. For example, if there are two classes
RootRoute
annotated with@Route("")
, and another classRouteA
annotated with@Route("route-a")
and@JavaScript("./src/javascript.js")
, thejavascript.js
will be run on the root route as well.External JavaScript dependencies (e.g. "http://example.com/some.js") are added in the same way as
Page.addJavaScript(String)
and the result is just adding a classicjavscript
element to the page. Other paths used in thevalue()
method are considered as relative tofrontend
directory and they are added to the page as a JavaScript module (ajavscript
element withtype="module"
). In this case aJavaScript
annotation behaves exactly as aJsModule
annotation.It's not possible to execute a function defined in JavaScript module via
UI.getCurrent().getPage().executeJs("some_function_definied_in_module()");
Page.addJavaScript(String)
: in this case all declared functions become available in the global scope.Since:
1.0
Author:
Vaadin Ltd
See Also:
-
-
Element Detail
-
value
String value
JavaScript file URL to load before using the annotated
Component
in the browser.Relative URLs are interpreted as relative to the configured
frontend
directory location.This URL identifies a file which will be bundled, so the file should be available to be able to bundle it.
You can prefix the URL with
context://
to make it relative to the context path or use an absolute URL to refer to files outside the frontend directory. Such URLs are not bundled but included into the page as standalone scripts in the same way as it's done byPage.addJavaScript(String)
.Returns:
a JavaScript file URL
-
-