Is there a way to change or disable the cache directory?

[vitorleonel]

Summary

Hi,

I'm having some issue building the storybook because we are using Nix in our pipeline. In the way that we use it, our node_modules folder is immutable, so the error is because the storybook build process creates a .cache folder inside it.

Is there a way to change or disable the cache directory?

I've tried a couple of stuffs, but I didn't get to far. Here is the last version of my main.ts:

import type { StorybookConfig } from '@storybook/react-vite';
import path from 'path';
import { mergeConfig } from 'vite';

const config: StorybookConfig = {
    stories: ['../stories/**/*.mdx', '../stories/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
    addons: [
        '@storybook/addon-links',
        '@storybook/addon-essentials',
        '@storybook/addon-onboarding',
        '@storybook/addon-interactions'
    ],
    framework: {
        name: '@storybook/react-vite',
        options: {}
    },
    docs: {
        autodocs: 'tag'
    },
    core: {
        builder: {
            name: '@storybook/builder-vite',
            options: {}
        }
    },
    viteFinal(config) {
        return mergeConfig(config, { cacheDir: path.resolve(__dirname, '.cache') });
    }
};
export default config;

It's keep creating the .cache folder inside node_modules. I'm using Vite 5, Storybook 7.6.8.

Additional information

No response

Create a reproduction

No response

[Marklb]

I don't see an option to change the directory, but the npm package 'find-cache-dir' is used to find the cache directory and it supports an environment variable CACHE_DIR. Since I haven't done this and haven't seen this mentioned anywhere, I don't know if there are any issues with doing this. It seemed to work in a quick test project that I created, though.

I didn't look to see if the vite config has a place for environment variables, but I would assume so. What I tried is the following, which works, but vite gave warnings that I didn't use an absolute path. So, setting it from the config is probably better and I assume it possible.

"storybook": "CACHE_DIR=\"./otherCacheDir\" storybook dev -p 6006",

I didn't see an option to disable the cache, but I just briefly went through the code and may have missed it.

[raydot]

I am having a similar problem. Need to move the root directory of CACHE_DIR.

[Marklb]

Did setting the environment variable, like I mentioned above, not work for you? If so, could you provide what framework and builder you are using?

[raydot]

Yes, setting the environment variable solved the problem. This should be documented somewhere. I'd be glad to do it.

[alexanderbazhenoff]

Got the same error:

ERR! Error: Could not create/find cache directory
ERR!     at /usr/src/app/node_modules/@storybook/builder-manager/dist/index.js:1:3584

Setting up env variable CACHE_DIR=/tmp didn't worked. I get rid of the error only when re-created node_modules/.cache and node_modules/.vite folders (it was 'gitignored').