6

I have setup a pnpm workspace with a number of projects that I am adding as git submodules.

A previously working Nuxt project suddenly started giving the error The request url * is outside of Vite serving allow list for multiple files, including dependencies installed as pnpm modules inside the workspace node_modules folder.

The only change had been to initialise my project as a git repository.

I was expecting the dev server to keep working, and that changes to git would not have any effect.

The project still builds ok.

a2k42
  • 672
  • 6
  • 19
  • Related (unanwsered) questions: https://stackoverflow.com/questions/74326498/the-request-url-f-anish-react-churi-expense-tracker-src-main-jsx-is-outside, https://stackoverflow.com/questions/74264304/main-tsx-is-outside-of-vite-serving-allow-list-for-a-reactts-project – a2k42 Dec 23 '22 at 18:04

3 Answers3

9

This is the recommanded way :

import { defineConfig, searchForWorkspaceRoot } from 'vite'

export default defineConfig({
  server: {
    fs: {
      allow: [
        // search up for workspace root
        searchForWorkspaceRoot(process.cwd()),
        // your custom rules
        '/path/to/custom/allow',
      ],
    },
  },
})
a2k42
  • 672
  • 6
  • 19
sancelot
  • 1,905
  • 12
  • 31
8

Vite uses "auto workspace root detection" to figure out where your project root is.

Within a pnpm workspace your project's node_modules will be installed at the root of the workspace and not within your project folder.

As soon as you initialise a git repository for your project within the workspace then vite seems to auto detect this as your project root and not the workspace (which I'm presuming is initialised as a git repo which you are adding submodules to).

The solution is to specify the pnpm workspace as an allowed directory for the vite server

export default defineNuxtConfig({
    vite: {
        server: {
            fs: {
                allow: ["/home/user/Monorepo"]
            }
        }
    }
})

vite: server-fs-allow

kissu
  • 40,416
  • 14
  • 65
  • 133
a2k42
  • 672
  • 6
  • 19
  • 1
    Works nice with absolute paths, but couldn't figure out how to make it work with relative paths (better in teams). – Schoenix Feb 09 '23 at 15:55
  • 2
    I tried this: https://stackoverflow.com/a/72327029/5935615 but the only thing that worked (but it feels a little bit dirty) is, instead of setting vite.server.fs.allow as you did, setting vite.server.fs.strict to false. – Schoenix Feb 09 '23 at 16:04
  • 1
    https://stackoverflow.com/questions/71113423/serve-static-images-in-development-with-vite-using-new-url – a2k42 Feb 12 '23 at 11:41
  • I've tried this solution with my own user path to the project, but still getting "Failed to load url" and "The request url...is outside of Vite serving allow list" errors. I'm not using pnpm workspace. My Node version is v18.15.0. Nuxt 3.3.3. My Nuxt app also worked fine before initializing as git repository. Now the app is constantly trying to load (browser tab spinning) and does not hot-reload. Is there something I'm missing? Any help appreciated! – anelec Apr 07 '23 at 16:42
  • @Anelec It's hard to say without knowing what you *are* using, npm workspace? You might also be able to output the result of `searchForWorkspaceRoot` to help with debugging and compare this to where your node_modules are in your setup. If that's not enough to resolve the issue then I'd suggest asking your own question and linking it to this one, then you can explain properly what your setup is and how/why this solution isn't working for you. hth – a2k42 Apr 09 '23 at 19:16
  • @a2k42 thanks for your response! i'm new to nuxt and don't know how to do the `searchForWorkspaceRoot` function...but yes I'm using an npm workspace and here's a [repo](https://github.com/celenatang/test-app) of the test project in which i'm getting the errors. i'm happy to create a new question too, if this is too much for comments – anelec Apr 11 '23 at 19:20
  • @anelec the path you've used in the allow array looks suspect to me – a2k42 Apr 12 '23 at 15:03
  • @a2k42 wow. i added a few more lines to the code. including a path to the local project and a path to the global "node_modules" folder on the system – with and without the asterisk to include all folders within....that seemed to do the trick. thanks so much for your help. you have no idea how long this took me and i don't know why it didn't work before. – anelec Apr 17 '23 at 21:28
1

If you are using svelte kit, the error might happen when trying to import a file from outside the src folder.

So if you can move said file to that folder, it's an easier fix, otherwise, the answer is @a2k42 's solution.

liquid_snake
  • 86
  • 7