# Nuxt Tutorial Series Error Adding Storybook

**URL:** <https://community.prismic.io/t/nuxt-tutorial-series-error-adding-storybook/5110>\
**Category:** Developing with Prismic\
**Tags:** nuxtjs\
**Created:** [April 26, 2021, 8:42pm UTC](https://community.prismic.io/t/nuxt-tutorial-series-error-adding-storybook/5110 "2021-04-26T20:42:53Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![developer2](https://avatars.discourse-cdn.com/v4/letter/d/8edcca/32.png) [@developer2](https://community.prismic.io/u/developer2)\
**Post date:** [April 26, 2021, 8:42pm UTC](https://community.prismic.io/t/nuxt-tutorial-series-error-adding-storybook/5110/1 "2021-04-26T20:42:53Z")

</div>

Hi there,

I've been following along with the Nuxt tutorial series [here](https://prismic.io/docs/technologies/recreate-banner-as-component-nuxtjs) and am running into an issue when trying to install storybook. After running the following command:

`prismic sm --add-storybook`

I get the following error:

```
ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/dist/cjs.js):
ValidationError: Invalid options object. PostCSS Loader has been initialized using an options object that does not match the API schema.
 - options has an unknown property 'order'.

FATAL Failed to run command nuxt-storybook:
Error: Command failed with exit code 1: nuxt-storybook

```

Here are the versions of my installs:  
`prismic-cli: 3.8.13`  
`node: v15.10.0`  
`nuxt: "^2.15.3"`  
`"@nuxtjs/storybook": "^4.0.2"`

---

<div class="post-metadata">

**Author:** ![Phil](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/phil/32/14_2.png) [@Phil](https://community.prismic.io/u/Phil)\
**Post date:** [April 27, 2021, 1:27pm UTC](https://community.prismic.io/t/nuxt-tutorial-series-error-adding-storybook/5110/2 "2021-04-27T13:27:31Z")

</div>

Hey Team,

I'm sorry to see you're running into this issue. I'm investigating this now and I'll get back to you once I recreate the issue on my end.

Thanks.

---

<div class="post-metadata">

**Author:** ![developer2](https://avatars.discourse-cdn.com/v4/letter/d/8edcca/32.png) [@developer2](https://community.prismic.io/u/developer2)\
**Post date:** [April 28, 2021, 3:57pm UTC](https://community.prismic.io/t/nuxt-tutorial-series-error-adding-storybook/5110/4 "2021-04-28T15:57:30Z")

</div>

Thanks @Phil,

Just following up if you've been able to reproduce this at all?

---

<div class="post-metadata">

**Author:** ![developer2](https://avatars.discourse-cdn.com/v4/letter/d/8edcca/32.png) [@developer2](https://community.prismic.io/u/developer2)\
**Post date:** [April 28, 2021, 7:00pm UTC](https://community.prismic.io/t/nuxt-tutorial-series-error-adding-storybook/5110/5 "2021-04-28T19:00:53Z")

</div>

Ok we ended up solving the issue. It seems that nuxt-storybook may have been updated to use PostCSS@version 8 and I think maybe the way the Prismic CLI was adding it, was likely still on a version below this.

Anyway for anyone who stumbles upon this in the future we just had to manually add PostCSS to our dependencies like so:

`yarn add -D postcss@^8`

---

<div class="post-metadata">

**Author:** ![Phil](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/phil/32/14_2.png) [@Phil](https://community.prismic.io/u/Phil)\
**Post date:** [April 29, 2021, 9:22am UTC](https://community.prismic.io/t/nuxt-tutorial-series-error-adding-storybook/5110/6 "2021-04-29T09:22:52Z")

</div>

Hey Team,

I'm sorry I never managed to find time to investigate this. Thank you so much for finding the issue though, I'm planning to update the Tutorial series to work from a boilerplate so we can avoid issues like this.

Thanks again.

---

<div class="post-metadata">

**Author:** ![system](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/system/32/1746_2.png) [@system](https://community.prismic.io/u/system)\
**Post date:** [April 30, 2021, 9:23am UTC](https://community.prismic.io/t/nuxt-tutorial-series-error-adding-storybook/5110/7 "2021-04-30T09:23:12Z")

</div>

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.

---

<div class="post-metadata">

**Author:** ![system](https://dub1.discourse-cdn.com/flex013/user_avatar/community.prismic.io/system/32/1746_2.png) [@system](https://community.prismic.io/u/system)\
**Post date:** [December 9, 2021, 4:20pm UTC](https://community.prismic.io/t/nuxt-tutorial-series-error-adding-storybook/5110/8 "2021-12-09T16:20:04Z")

</div>


