Hugo site with an embedded Vue app
Vue app is located in src/dashboard, once you run the build command yarn build, the vue app will be built into the static/dist/dashboard folder. From here the layouts/dashboard/baseof.html template will embed the vue app using the generated data/webpack_asset_dashboard.json file.
The vue app has routing set up, so any page under the /dashboard path will render the Vue app, meaning you can't have any Hugo generated pages under that path.
Issues
- You need to create a
.mdfile for each Vue route, otherwise Hugo will 404
Test it out yourself
- Clone the repo
- Change node version to
.nvmrcversion - Change to
src/dashboard - Run
yarn&yarn build - Go back to the root and build the Hugo site;
hugo - Serve the site;
npx serve public