Stack Overflow
Stack Overflow

Questions tagged [nuxt.js]

Nuxt.js is a framework for creating Vue.js applications, you can choose between Universal, Static Generated or Single Page application (inspired by Next.js)

As a framework, Nuxt.js comes with a lot of features to help you in your development between the client side and the server side such as Asynchronous Data, Middleware, Layouts, etc.

Nuxt.js includes the following to create a rich web application development:

One of the main benefits is an easy to setup Server Side Rendering which improves Page performance and Search Engine Optimization.

enter image description here

Instead of rendering the content in the client Nuxt (Universal Mode) will send a Server Rendered File which reduces the load time and is way better for Search Engine Crawlers to detect.

Nuxt Generate provides a powerful tool to prerender pages but you can also use the SPA Mode, or in Static mode (generate static html files).

Useful links

12116 questions
559
votes
47 answers

Why does Prettier not format code in VS Code?

In my Nuxt application where ESlint and Prettier are installed and enabled, I switched to Visual Studio Code. When I open a .vue file and press CMD+ Shift + P and choose Format Document, my file does not get formatted at all. My .prettierrc…
Billal Begueradj
  • 20,717
  • 43
  • 112
  • 130
132
votes
4 answers

Why is 'type: module' in package.json file?

I upgraded the node and built the existing file. But it didn't build, and there was an error. Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: │ │ ~~/nuxt.config.js │ │…
Rebbeca
  • 1,587
  • 2
  • 10
  • 12
90
votes
21 answers

Vuejs Error: The client-side rendered virtual DOM tree is not matching server-rendered

I am using Nuxt.js / Vuejs for my app, and I keep facing this error in different places: The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting…
asanas
  • 3,782
  • 11
  • 43
  • 72
85
votes
9 answers

How to get route url params in a page in Nuxt2 and 3?

I am using Nuxt.js, and have a dymanic page which is defined under pages/post/_slug.vue So, when I visit the page url, say, http://localhost:3000/post/hello-world, how can I read this slug parameter value inside my page. Currently I am geting it…
asanas
  • 3,782
  • 11
  • 43
  • 72
78
votes
11 answers

Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: No "exports" main resolved in /app/node_modules/@babel/helper-compilation-targets/package.json

I'm having trouble building my nuxt images in a travis CI pipeline. My local environment is ubuntu 18.04 - docker version 19.03.11 docker-compose version 1.24.1 I'm able to build and run my images locally but on the travis CI I get the following…
Simon
  • 1,280
  • 3
  • 10
  • 21
77
votes
5 answers

Difference between Asyncdata vs Fetch

What is the exact difference between fetch and async data. The official documentation says the following: asyncData You may want to fetch data and render it on the server-side. Nuxt.js adds an asyncData method that lets you handle async operations…
Yakalent
  • 1,142
  • 2
  • 10
  • 18
66
votes
6 answers

How to get current route name in Nuxt 2 and 3?

I'm using Nuxt.js for building a static website. How to access in component's script code currently displayed route name (I would like to avoid reading direct url from browser location)? Can I somehow access $route.name ?
lukaszkups
  • 5,790
  • 9
  • 47
  • 85
63
votes
6 answers

potentially fixable with the `--fix` option

I am creating a app with nuxt.js but everytime I launch the app, gives me the error of eslint and saying "potentially fixable with the --fix option." I did the command npm run lint -- --fix and it works but then If I do another change in any vue…
Ricardo Moreira
  • 947
  • 1
  • 9
  • 20
60
votes
8 answers

How to solve "semi-colon expected" warnings (css-semicolonexpected)

I'm trying to use Tailwindcss @apply directive in a