File outside of Vite serving allow list

[lungarella-raffaele]

Describe the bug

I am building a Svelte component library, I am using Storybook and would like to import a .css file inside my components, more precisely inside the preview.ts file of storybook. My .css file is inside my static folder, when I try to import it I get the error:

The request url "/Users/myapp/static/app.css" is outside of Vite serving allow list.

- /Users/myapp/src/lib
- /Users/myapp/src/routes
- /Users/myapp/.svelte-kit
- /Users/myapp/src
- /Users/myapp/node_modules
- /Users/myapp/.storybook

I read the docs and to fix this issue it seems like the solution would be to put the file inside my vite serving allow list like this:

  server: {
    fs: {
      allow: [
        searchForWorkspaceRoot(process.cwd()),
        "/static/css/bootstrap-italia-custom.min.css",
      ],
    },
  },

But nothing seems to change, I tried putting the full url, I tried by selecting only the parent folder, I tried without the searchForWorkspaceRoot utility, but nothing seems to woek. What am I doing wrong?

Reproduction

Small repo created from npm create svelte@latest with only storybook added as dependency: https://github.com/lungarella-raffaele/vite-issue to recreate the problem

Steps to reproduce

npm run storybook

Vite cannot serve the app.css file even though it is specified in the configs

System Info

node: v21.7.3
MacOs Sequoia

Used Package Manager

npm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[hi-ogawa]

Probably storybook is manipulating server.fs.allow, so you should check with them.
Usually server.fs.allow should be process.cwd() = "/Users/myapp" and that shouldn't cause the issue.

For example, you can enforce this by the plugin for the time being:

export default defineConfig({
  plugins: [
    sveltekit(),
    {
      name: "config",
      enforce: "post",
      config(config) {
        config.server.fs.allow = [process.cwd()];
      },
    }
  ],
})