Build a static HTML website with Poi
> Update: Official docs for this feature: https://poi.js.org/plugins/vue-static.html
Poi can magically turn your Vue single-page application into a static HTML website, i.e. each page of your website is pre-rendered at build time.
Getting started with a regular Vue app, the only change you need to make is exporting the Vue instance you have:
📝 index.js:
📝 App.vue
That’s it! Make sure the id of root element is app and your router is under history mode.
Finally you can use @poi/plugin-vue-static to generate static HTML files.
📝 poi.config.js
In development mode, i.e. running with the poi command, this plugin doesn’t really do too much, your app will still be running as an SPA.
In production mode, i.e. built with the poi build command, this plugin uses vue-server-renderer to generate static HTML pages for routes. In this mode it’s quite similar to how nuxt generate works.
Demo
The website of the official Vue online chat community is built by Poi, and it’s pre-rendered by this plugin too.
