如何摆脱“@rollup/plugin-typescript: Rollup 'sourcemap' 选项必须设置为生成源映射。”警告?
Posted
技术标签:
【中文标题】如何摆脱“@rollup/plugin-typescript: Rollup \'sourcemap\' 选项必须设置为生成源映射。”警告?【英文标题】:How to get rid of the "@rollup/plugin-typescript: Rollup 'sourcemap' option must be set to generate source maps." warning?如何摆脱“@rollup/plugin-typescript: Rollup 'sourcemap' 选项必须设置为生成源映射。”警告? 【发布时间】:2020-11-17 13:37:33 【问题描述】:每次构建生产时都会收到此警告。当我为生产构建时,我在汇总输出配置中禁用源映射。
output: [ dir: "...", format: "...", sourcemap: isProd ? false : true ]
我在开发和生产中使用相同的 tsconfig,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"]
我了解到这是查看汇总插件源代码的警告的原因:
/**
* 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.`);
但我不希望增加一个 tsconfig 用于开发和另一个用于生产的复杂性。
消除此警告的好方法是什么?
【问题讨论】:
【参考方案1】:使用基本 tsconfig 并仅添加与 dev 和 prod 版本不同的选项,如参考所示:
https://github.com/microsoft/TypeScript/issues/9876
https://www.typescriptlang.org/docs/handbook/tsconfig-json.html#configuration-inheritance-with-extends
【讨论】:
使用"sourceMap": true
设置禁用源地图;如果您要扩展一个,还要注意基本配置。
这对我来说效果很好:typescript(tsconfig: production? "./tsconfig.prod.json" : "./tsconfig.json",
)【参考方案2】:
就我而言,我使用的是官方的 Svelte starter template,与 TypeScript 集成。
就我而言,我不需要将我的 tsconfig 更改为模板扩展的默认配置(具有 "sourceMap": true,
);我只需要更改rollup.config.js
中的output.sourcemap
设置,使其与我传递给typescript()
插件的选项保持一致:
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
;
【讨论】:
以上是关于如何摆脱“@rollup/plugin-typescript: Rollup 'sourcemap' 选项必须设置为生成源映射。”警告?的主要内容,如果未能解决你的问题,请参考以下文章