Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Source Maps broken: Could not load content for webpack: #26954

Open
kasperpeulen opened this issue Apr 25, 2024 Discussed in #26948 · 4 comments
Open

Source Maps broken: Could not load content for webpack: #26954

kasperpeulen opened this issue Apr 25, 2024 Discussed in #26948 · 4 comments
Assignees
Labels

Comments

@kasperpeulen
Copy link
Contributor

Discussed in #26948

Originally posted by tomitrescak April 25, 2024

Summary

Hello

My sourcemaps are broken with webpack and not loaded in any browser I tried (Chrome, Firefox, Safari).

With chrome I get this error:
Could not load content for webpack://..

With Firefox:
Error while fetching an original source: unsupported protocol for sourcemap request webpack://

Additional information

// main.ts

import type { StorybookConfig } from "@storybook/nextjs";
import react from "@vitejs/plugin-react-swc";
import tsconfigPaths from "vite-tsconfig-paths";

const config: StorybookConfig & { viteFinal: any } = {
  stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
  addons: [
    "@storybook/addon-onboarding",
    "@storybook/addon-links",
    "@storybook/addon-essentials",
    "@chromatic-com/storybook",
    "@storybook/addon-interactions",
  ],
  framework: {
    name: "@storybook/nextjs",
    options: {},
  },
  docs: {
    autodocs: "tag",
  },
  staticDirs: ["../public"],
  features: {
    experimentalRSC: true,
  },
};
export default config;

This is preview.ts

import type { Preview } from "@storybook/react";

import { initialize, mswDecorator } from "msw-storybook-addon";

import "../src/dark.scss";
import "../src/main.scss";
import "../src/utility.css";

const preview: Preview = {
  parameters: {
    nextjs: {
      appDirectory: true,
    },
    controls: {
      matchers: {
        color: /(background|color)$/i,
        date: /Date$/i,
      },
    },
  },
};

initialize();
export const decorators = [mswDecorator];

export default preview;

Create a reproduction

No response

@kasperpeulen
Copy link
Contributor Author

cc @valentinpalkovic

@kasperpeulen kasperpeulen self-assigned this Apr 25, 2024
@kasperpeulen
Copy link
Contributor Author

cc @shilman and @valentinpalkovic

@vottens
Copy link

vottens commented May 7, 2024

We have the same issue. Impossible to debug when using storybook to TDD.

@tomitrescak
Copy link
Contributor

@vottens you can switch temporarily to vite-builder which builds correct maps, but you will lose the Next.js 13 support. Unfortunately, I need Nextjs 13 and am working without source maps. Doable, ..., not pleasant :/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
Status: Empathy Backlog
Development

No branches or pull requests

3 participants