Merge pull request #28585 from storybookjs/valentin/fix-source-maps-f…

…or-webpack

Webpack: Fix sourceMap generation in csf-tools

code/core/src/csf-tools/CsfFile.ts

@@ -3,7 +3,7 @@ import { readFile, writeFile } from 'node:fs/promises';
 import { dedent } from 'ts-dedent';
 
 import * as t from '@babel/types';
-import bg from '@babel/generator';
+import bg, { type GeneratorOptions } from '@babel/generator';
 import bt from '@babel/traverse';
 
 import * as recast from 'recast';
@@ -599,15 +599,9 @@ export const loadCsf = (code: string, options: CsfOptions) => {
  return new CsfFile(ast, options);
 };
 
-interface FormatOptions {
- sourceMaps?: boolean;
- preserveStyle?: boolean;
- inputSourceMap?: any;
-}
-
 export const formatCsf = (
  csf: CsfFile,
- options: FormatOptions = { sourceMaps: false },
+ options: GeneratorOptions & { inputSourceMap?: string } = { sourceMaps: false },
  code?: string
 ) => {
  const result = generate(csf._ast, options, code);

code/lib/csf-plugin/src/webpack-loader.ts

@@ -20,7 +20,11 @@ async function loader(this: LoaderContext, content: string, map: any) {
  const csf = loadCsf(content, { makeTitle }).parse();
  const csfSource = loadCsf(sourceCode, { makeTitle }).parse();
  enrichCsf(csf, csfSource, options);
- const formattedCsf = formatCsf(csf, { sourceMaps: true, inputSourceMap: map }, content);
+ const formattedCsf = formatCsf(
+ csf,
+ { sourceMaps: true, inputSourceMap: map, sourceFileName: id },
+ content
+ );
 
  if (typeof formattedCsf === 'string') {
  return callback(null, formattedCsf, map);