Django + Vite + Vue with Router does not work

Question

I am trying to run the basic Vite default app with router to run a vue 3 front end along with Django. However I am receiving the following error which generally doesn't come when running only a Vite with vue router app.

Uncaught SyntaxError: Unexpected token 'export' (at index-2331cb67.js:5:33627)
Uncaught SyntaxError: Cannot use import statement outside a module (at AboutView-d0a85a00.js:1:1)

I have updated the code here. Please guide.

Answer 1

This can be resolved in following 2 ways:

1. Using type="module" in Django template dynamic script calling section.
2. Changing store.js to declare store and then export it as default.
3. Using any dynamic imports via defineAsyncComponent()

Working code is updated here.