[Vuejs]-Nuxt.js static site relative urls

0👍

Nuxt.js doesn’t appear to support relative urls (see above). However Vue3 and Vite does.

Reproduction steps:

npm install vue@next
npm install -g @vue/cli
npm init @vitejs/app my-app

output:

@vitejs/create-app
Ok to proceed? (y) y
✔ Select a framework: · vue
✔ Select a variant: · TypeScript
cd my-app
npm install
npm run build

vite.config.ts

import vue from '@vitejs/plugin-vue'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  base: './'
})

-1👍

If you want to load some JSONs into your Nuxt app, you should use nuxt-content. I’ve actually created a boilerplate here that you can check: https://github.com/kissu/nuxt-tailwind-typography-darkmode-boilerplate

You can find 2 articles in /content/articles. There, you can see how to fetch then and how to display them.

Full static Nuxt do not require any server indeed. You can even SSR (ssr: true) it and still have it as target: static.

publicPath is not the right thing here. It should not be used, neither should you use any of the following: _nuxt, .nuxt or alike.
yarn generate, then deploy your /dist directory to a simple free platform, like Netlify and you’ll be gucci. You can try my project if you want (beware, there is more configuration than neeed in your case).

If you want to add something to your head, please follow this documentation: https://nuxtjs.org/docs/2.x/features/meta-tags-seo

👤kissu

Leave a comment