Does not work with Gridsome

[dakshshah96]

Thanks for building this!

I've been trying to get this accordion to work with Gridsome but there seem to be some weird layout and stylistic bugs. I've also tried using the <ClientOnly> option in Gridsome but that doesn't work too.

Reproduction: CodeSandbox

[Lunrtick]

Hey! I'm glad you're enjoying it.

When I open your CodeSandbox, I get this error

Vue packages version mismatch:

- [email protected] (/sandbox/node_modules/vue/dist/vue.runtime.common.js)
- [email protected] (/sandbox/node_modules/vue-template-compiler/package.json)

I tried forking it and manually adding the dependency, but it seems stuck at "container is starting".

[dakshshah96]

@Lunrtick Oops, CodeSandbox is acting weird. Just created a new sandbox. Please check this out for the reproduction: https://codesandbox.io/s/gridsomegridsome-starter-default-o8ty8

Also updated the link in the issue.

[Lunrtick]

Just tried it again - saw the same error, and now every visit I get a 502 error. Possibly an issue with the starter template you're using?

[dakshshah96]

@Lunrtick This is very weird behaviour from CodeSandbox. I created one more sandbox and tested it out in incognito mode as well, seems to be starting now without any error.

Please check out this sandbox for the reproduction: https://codesandbox.io/s/gridsomegridsome-starter-default-yz7bv

Sorry for all the to and fro!

[dakshshah96]

@Lunrtick Are you able to see the reproduction now?

[Lunrtick]

I'm still running into the same error - Vue packages version mismatch. I think you just need to explicitly set the versions in your sandbox.