Error when adding muiCache from mui-5 documentation

[nenaddimitrijevic89]

Does someone had this kind of error:

Argument of type '{ key: string; prepend: boolean; }' is not assignable to parameter of type 'Options'.
  Object literal may only specify known properties, and 'prepend' does not exist in type 'Options'

when adding this piece of code from mui-5 documentation

export const muiCache = createCache({ key: 'mui', prepend: true })

[garronej]

Hi @nenaddimitrijevic89,
Make sure you are importing createCache like this: import createCache from "@emotion/cache";.
If you are, update @emotion/styled and @emotion/react to the latest version and you should be good to go.

Best

[nenaddimitrijevic89]

@garronej bro, its not working without manually installed @emotion/cache. I tried this now.
Guess I must have @emotion/cache installed as dependancy.

[garronej]

Well, all I can say for sure is that you have emotion v10 (more than two years old) and emotion v11 cohabiting in your project.
It can be the case if you are using Storybook but it doesn’t explain why @emotion/cache resolves to v11 instead of v10.
Could be that you have "@emotion/xxx": "^10.X.Y" instead of @emotion/yyy": "^11.X.Y in your package.json or it could be something else that I don't understand but I can't figure it out without seeing the full package.json and yarn.lock.

Anyway,
Best regards,

[nenaddimitrijevic89]

@garronej here are my yarn.lock and package.json.
Thanks for your help :)
yarn.zip

[nenaddimitrijevic89]

@garronej here are my yarn.lock and package.json. Thanks for your help :) yarn.zip

Hi @garronej, can you help about this, i attached yarn.lock and package.json. Can you see why i had to manually install @emotion/cache ?
Thank you in advance

[garronej]

You have react-select that d

You are using @storybook/addon-knobs that is a deprecated package that uses react-select that has a hard dependency on emotion 10.
If you can, get rid of Storybook Addon Knobs in favor of @storybook/addon-controls.

If you cant add a theses to the resolution field of your package.json:

"resolutions": {
        "babel-loader": "8.2.2",
        "@emotion/cache": "11.7.1",
        "@emotion/serialize": "1.0.2",
        "@emotion/utils": "1.1.0"
}

I asume you have done this already but you should also follow the instructions to make Storybook work with emotion 11: https://docs.tss-react.dev/readme-1

Regards