Skip to content

ClientLibs Support

A simple solution to this problem would be to have another separate ClientLib structure containing only js.txt. Each ClientLib directory would have a unique name as outlined below.

ClientLib CategoryesModulenoModulecss.txtjs.txt

There is no real importance to how you name your ClientLibs as the order of how they get output is determined by your template policy.

Update your template policy

It is important that in the above example that is generated first in the page source. To ensure this is the case, make sure your template policy is similar to the below.

<page jcr:primaryType="nt:unstructured">

This will vary from project-to-project, use the above as a guide only.

How to test that things work?

Open DevTools in your browser and navigate to the Network tab (or equivalent). Refresh the page and filter by JS files. You should observe ClientLibs loading from when using a modern browser otherwise clientlib-site.legacy.

What if I don't want ES modules?


Simply have Vite build only legacy bundles by using the config option. From the above, simply omit and ensure your clientlib-site.legacy ClientLib contains both a css.txt and js.txt file.

Both the esModule and noModule properties won't be required in this case since we are no longer working with an ES module.

Apache 2.0 Licensed. Vite wording and logos are property of Evan You. Adobe and AEM wording and logos are property of Adobe Inc.