How can I host spa project output in CDN and load it in html page like a plugin ? For example Swagger UI can load from CDN and load UI in an HTML tag.
Currently I can do it manually by something like this
const nuxtApp = document.createElement('div');
nuxtApp.id = '__nuxt';
document.querySelector(config.selector).appendChild(nuxtApp);
[
'http://cdn_link/_nuxt/runtime.XXXXX.js',
'http://cdn_link/_nuxt/app.XXXXX.js'
].forEach(src => {
const tag = document.createElement('script');
tag.src = src;
document.body.appendChild(tag);
})
}
The above file I'd manually created based on build output and then in my local html file I can do like this.
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="app"></div>
<script src="http://cdn_link/lib.js"></script>
<script >
initApp({
selector: '#app'
})
</script>
</body>
</html>
Is there any easier way to create the lib file along with the build of nuxt ?