Define the Importmap for a Module
Last modified by Eleni Cojocariu on 2026/09/25 02:48
Content
Steps
Map a module's bare import ID to the URL of its JavaScript entry point with the xwiki.extension.javascript.modules.importmap Maven property, needed when the module depends on JavaScript it does not bundle, as the example below does for Vue.
- Add the dependency you wish to map to the runtime dependencies of the module.
<?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <dependencies> <!-- ... --> <dependency> <groupId>org.webjars.npm</groupId> <artifactId>vue</artifactId> <scope>runtime</scope> </dependency> <!-- ... --> </dependencies> </project> - Declare theĀ xwiki.extension.javascript.modules.importmap property.
<?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <properties> <xwiki.extension.javascript.modules.importmap> { "vue": "org.webjars.npm:vue/dist/vue.runtime.esm-browser.prod.js" } </xwiki.extension.javascript.modules.importmap> </properties> </project> - Check the final result.
<?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <parent> <groupId>org.xwiki.platform</groupId> <artifactId>xwiki-platform-livedata</artifactId> <version>18.1.0-SNAPSHOT</version> </parent> <packaging>webjar-node</packaging> <artifactId>xwiki-platform-livedata-webjar</artifactId> <properties> <xwiki.extension.javascript.modules.importmap> { "vue": "org.webjars.npm:vue/dist/vue.runtime.esm-browser.prod.js" } </xwiki.extension.javascript.modules.importmap> </properties> <dependencies> <dependency> <groupId>org.webjars.npm</groupId> <artifactId>vue</artifactId> <scope>runtime</scope> </dependency> </dependencies> </project>