How to get rid of the "#rollup/plugin-typescript: Rollup 'sourcemap' option must be set to generate source maps." warning? - rollupjs

Question

I get this warning every time I build for production. When I build for production I disable source maps in the rollup output config.
output: [{ dir: "...", format: "...", sourcemap: isProd ? false : true }]
I use the same tsconfig for dev and production, tsconfig.json:
{
"compilerOptions": {
// Output
"target": "ESNext",
"module": "ESNEXT",
"sourceMap": true,
"jsx": "react",
"noEmit": true,
// Compile time code checking
"strict": true,
// Libraries
"lib": ["dom", "esnext"],
// Imports
"moduleResolution": "node",
"allowSyntheticDefaultImports": true,
"esModuleInterop": true
},
"exclude": ["dist", "app"]
}
I understand that this is the reason for the warning from looking at the rollup plugin source code:
/**
* Validate that the `compilerOptions.sourceMap` option matches `outputOptions.sourcemap`.
* #param context Rollup plugin context used to emit warnings.
* #param compilerOptions Typescript compiler options.
* #param outputOptions Rollup output options.
* #param autoSetSourceMap True if the `compilerOptions.sourceMap` property was set to `true`
* by the plugin, not the user.
*/
function validateSourceMap(context, compilerOptions, outputOptions, autoSetSourceMap) {
if (compilerOptions.sourceMap && !outputOptions.sourcemap && !autoSetSourceMap) {
context.warn(`#rollup/plugin-typescript: Rollup 'sourcemap' option must be set to generate source maps.`);
}
else if (!compilerOptions.sourceMap && outputOptions.sourcemap) {
context.warn(`#rollup/plugin-typescript: Typescript 'sourceMap' compiler option must be set to generate source maps.`);
}
}
But I would prefer to not add the complexity of one tsconfig for dev and another for production.
What would be a good way to get rid of this warning?

Answer 1

In my case, I was using the official Svelte starter template, with TypeScript integration.
In my case, I didn't need to change my tsconfig from the default one extended by the template (which had "sourceMap": true,); I just needed to change the output.sourcemap setting in my rollup.config.js to make it consistent with the options I'd passed into the typescript() plugin:
const production = !process.env.ROLLUP_WATCH;
export default {
input: 'src/main.ts',
output: {
// sourcemap: true, // <-- remove
sourcemap: !production,
format: 'iife',
name: 'app',
file: 'public/build/bundle.js'
},
plugins: [
svelte({
preprocess: sveltePreprocess({ sourceMap: !production }),
compilerOptions: {
dev: !production
}
}),
css({ output: 'bundle.css' }),
resolve({
browser: true,
dedupe: ['svelte']
}),
commonjs(),
typescript({
sourceMap: !production,
inlineSources: !production
}),
!production && serve(),
!production && livereload('public'),
production && terser()
],
watch: {
clearScreen: false
}
};

Answer 2

Use a base tsconfig and add only the options that are different to dev and prod versions, as reference see:
https://github.com/microsoft/TypeScript/issues/9876
https://www.typescriptlang.org/docs/handbook/tsconfig-json.html#configuration-inheritance-with-extends