Static GitHub Issues

[1954] How to properly inline external JS referenced in the Nuxt generated HTML files?

prev: How can I use the translate service by vue-i18n in store module actions?
next: Opening page as a modal and changing route

Hi @Atinux @alexchopin @pi0 , thanks for the great work of Nuxt! I have a quick question: how do I inline the JavaScript files when using Nuxt generate? I tried to run an inliner (https://github.com/jrit/web-resource-inliner) on the generated HTML files, but after inlining, the JS code for the components doesn't seem to be executing (specifically the methods), I assume it's because of the code-splitting definitions in the manifest.hash.js? I also tried to use https://github.com/DustinJackson/html-webpack-inline-source-plugin following the example plugins definitions on their README and https://nuxtjs.org/faq/webpack-plugins, but the JS files were not inlined.

In our use case, we run nuxt generate on a utility host, and after the generate finishes, we write the generated HTML files' content into a cache shared with the customer-facing web server, and the web server would just respond with the content from the cache as HTML response. But since the web server can't access the dist folder (on different hosts than the utility host that runs nuxt generate) where the generated HTML files and other assets are stored, if not inlining the external resources referenced in the HTML files, the customers won't be able to use the page normally - can't see images, no interactions (JS missing).

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1742">#c1742</a>)</em></sub></div>