Storybook + Vite no loader is configured for .node files | Vite Land | Page 1

I'm trying to setup Storybook 8.2 with Vite. Here is my storybook config:

import type { StorybookConfig } from "@storybook/react-vite";

import { nxViteTsPaths } from "@nx/vite/plugins/nx-tsconfig-paths.plugin";
import { mergeConfig } from "vite";
import { UserConfig } from "vite";

const config: StorybookConfig = {
  stories: ["../../../../packages/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
  framework: {
    name: "@storybook/react-vite",
    options: {
      builder: {
        viteConfigPath: "../../../vite.config.ts"
      }
    }
  },
  refs: {
    next: {
      title: "Next.js",
      url: "http://localhost:7007"
    }
  },
  viteFinal: async (config: UserConfig) =>
    mergeConfig(config, {
      plugins: [nxViteTsPaths()],
      build: {
        rollupOptions: {
          external: [
            "universal-fs",
            "packages/etech-ui-utils/**",
            "@ngrok/ngrok-darwin-arm64",
            "@ngrok/ngrok-darwin-universal"
          ]
        }
      }
    })
};

export default config;

However, when running npx storybook dev I get an error:

✘ [ERROR] No loader is configured for ".node" files: 

    ../../../node_modules/.pnpm/@[email protected]/node_modules/@ngrok/ngrok

✘ [ERROR] No loader is configured for ".node" files: ../../../node_modules/.pnpm/@[email protected]/node_modules/@ngrok/ngrok-darwin-universal/ngrok.darwin-universal.node

It's worth noting that I'm in an NX monorepo this storybook is nested in apps/storybook/vite-react. There are other dependencies that are problematic so I'm trying to ignore them with rollup options. However, I still get the error.

I have tried several Github suggestions without luck. Essentialy I want Vite to only watch where stories are found. How can I do that?

#Storybook + Vite no loader is configured for .node files