Can't follow the example with Vue3

[phootip]

I tried following the example with Vue3, installed with npm install vue-json-pretty@next --save
here's the code

<template>
  <div>
    <vue-json-pretty :path="'res'" :data="{ key: 'value' }"> </vue-json-pretty>
  </div>
</template>

<script>
import VueJsonPretty from "vue-json-pretty";
import "vue-json-pretty/lib/styles.css";

export default {
  components: {
    VueJsonPretty,
  },
};
</script>

It keeps throwing these errors

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading '_c')
    at Proxy.<anonymous> (vue-json-pretty.js:1:9751)
    at renderComponentRoot (runtime-core.esm-bundler.js:893:44)
    at ReactiveEffect.componentUpdateFn [as fn] (runtime-core.esm-bundler.js:5030:57)
    at ReactiveEffect.run (reactivity.esm-bundler.js:167:25)
    at setupRenderEffect (runtime-core.esm-bundler.js:5156:9)
    at mountComponent (runtime-core.esm-bundler.js:4939:9)
    at processComponent (runtime-core.esm-bundler.js:4897:17)
    at patch (runtime-core.esm-bundler.js:4489:21)
    at mountChildren (runtime-core.esm-bundler.js:4685:13)
    at mountElement (runtime-core.esm-bundler.js:4594:17)

and other warnings about "was accessed but not defined

Could you help please?

[leezng]

Can you provide more information?

[NicolasReibnitz]

I had the same problem. I missed the part about using @next when installing it into a Vue3 project.

Try to install the package like this:

npm install vue-json-pretty@next --save

[leezng]

Sorry, I can't reproduce the problem. Can anyone help?
Like: https://codesandbox.io/s/vue-json-pretty-vue3-96jssd (The codesandbox sometimes reports an error, just refresh.)

[NicolasReibnitz]

For me it wasn't really a problem with the package. I just installed the Vue2 version instead of the Vue3 version. I made a mistake. After I got the correct version everything worked as expected. But with the wrong version I got the same error as @phootip got. Which is to be expected. So I guess he also installed the wrong version.

[phootip]

npm install vue-json-pretty@next --save

I did install with this command, I will try to reproduce the problem on code sandbox if possible

[pochojordan]

It's the same error for me. I have "vue-json-pretty": "^2.0.6", the latest and the error continues. Any solution?

[damnwenxi]

retry npm run dev, its worked for me.