I am developing a Vue app that will be "iframed" into a 3rd party framework. I can develop my app locally under the localhost, but in order to preview it in the 3rd party tool, the URL should be: https://localhost:5001/sampleapp/index.html
.
I have two versions of the same app. One was built with Vue-CLI and the 2nd one with Vite.
When I try to preview the Vite version of the app, I get a blank page.
When using Vue CLI version, I get a working app and can develop it as I would normally do, and it 'hot-reloads' in the iframe.
How do I achieve the same with Vite?
=====================================================================EDIT:
It turned out, that for the Vite version, I actually had to run the App in the preview mode. My final vite.config.js:
export default defineConfig({ plugins: [vue()], base: '/sampleapp/index.html/', server: { port: 5001, https: true, }, preview: { port: 5001, https: true, }})
and then run npm run build && npm run preview
.