Tips for Common Pitfalls (`$fetch` vs `useFetch`, `public` vs `assets`)
Just a note for all, since these questions comes in here regularly.
From the docs:
So the
(this module is built into nuxt)
Docs: https://nuxt.com/docs/getting-started/assets
You mainly want to use the
https://nuxt.com/docs/guide/directory-structure/public
The
https://nuxt.com/docs/getting-started/assets#assets-directory
Example:
- you have a few
- you have some css files you want to include. You would put them into
- you have some 5mb 4000x3000 jpegs: you can either use nuxt/image (where they can stay in
$fetch
vs useFetch
$fetchuseFetchFrom the docs:
,useFetch,useLazyFetchanduseAsyncDataonly work during setup or Lifecycle HooksuseLazyAsyncData
https://nuxt.com/docs/getting-started/data-fetching#usefetch
So the
use...$fetchimport { $fetch } from 'ofetch'(this module is built into nuxt)
public
vs assets
directory
publicassetsDocs: https://nuxt.com/docs/getting-started/assets
You mainly want to use the
publichttps://nuxt.com/docs/guide/directory-structure/public
The
assetsnuxt-svgohttps://nuxt.com/docs/getting-started/assets#assets-directory
Example:
- you have a few
woff2public- you have some css files you want to include. You would put them into
assets- you have some 5mb 4000x3000 jpegs: you can either use nuxt/image (where they can stay in
publicassets
Nuxt
The public/ directory is used to serve your website's static assets.
Nuxt
Nuxt provides composables to handle data fetching within your application.
