CODEWITHSUNDEEP
javascriptnuxt.js
devaent
devaent

Reputation: 449

How do I resolve Cannot stringify a function error in Nuxt?

I am trying to follow the steps in this lesson: https://regenrek.com/posts/create-a-frontmatter-markdown-powered-blog-with-nuxt.js/

And I believe I have configured everything correctly, but something about my configuration is not working. I am getting a very uninformative error message:

In the server console


 WARN  Cannot stringify a function data                               15:30:31


 WARN  Cannot stringify a function render                             15:30:31


 WARN  Cannot stringify a function created                            15:30:31


 WARN  Cannot stringify a function VueComponent

In the client

RangeError
Maximum call stack size exceeded
node_modules/@nuxt/devalue/dist/devalue.cjs.js:207:20
stringifyPrimitive
node_modules/@nuxt/devalue/dist/devalue.cjs.js:92:20
stringify
node_modules/@nuxt/devalue/dist/devalue.cjs.js:129:98
node_modules/@nuxt/devalue/dist/devalue.cjs.js:129:49
stringify
node_modules/@nuxt/devalue/dist/devalue.cjs.js:129:98
node_modules/@nuxt/devalue/dist/devalue.cjs.js:129:49
stringify
node_modules/@nuxt/devalue/dist/devalue.cjs.js:129:98
node_modules/@nuxt/devalue/dist/devalue.cjs.js:129:49
stringify
node_modules/@nuxt/devalue/dist/devalue.cjs.js:129:98
node_modules/@nuxt/devalue/dist/devalue.cjs.js:129:49
stringify
node_modules/@nuxt/devalue/dist/devalue.cjs.js:129:98

I do not understand the source of this error, or how to resolve it. Everything I have in this sandbox matches with the demo sandbox and should work as far as I can tell.

How do I debug this error? Why does frontmatter-markdown-loader not work for me?

Upvotes: 4

Views: 5618

Answers (1)

Aldarund
Aldarund

Reputation: 17621

The issue is that the refenced demo sandbox uses SPA mode ( see nuxt.config ) while you are using universal SSR mode.

When using universal mode your data from asyncData need to serialized from server to client. And so it cant be serialized properly, because you are importing components inside it. Only plain js objects can be serialized, not vue components

Upvotes: 4

Related Questions