Skip to content

Commit be1eff0

Browse files
bluwybluwy
authored
[feat] add enableSourcemap option (#6835)
1 parent 3f11232 commit be1eff0

File tree

17 files changed

+117
-21
lines changed

17 files changed

+117
-21
lines changed

‎site/content/docs/04-compile-time.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -82,6 +82,8 @@ The following options can be passed to the compiler. None are required:
8282
| `loopGuardTimeout` | 0 | A `number` that tells Svelte to break the loop if it blocks the thread for more than `loopGuardTimeout` ms. This is useful to prevent infinite loops. **Only available when `dev: true`**
8383
| `preserveComments` | `false` | If `true`, your HTML comments will be preserved during server-side rendering. By default, they are stripped out.
8484
| `preserveWhitespace` | `false` | If `true`, whitespace inside and between elements is kept as you typed it, rather than removed or collapsed to a single space where possible.
85+
| `sourcemap` | `object | string` | An initial sourcemap that will be merged into the final output sourcemap. This is usually the preprocessor sourcemap.
86+
| `enableSourcemap` | `boolean | { js: boolean; css: boolean; }` | If `true`, Svelte generate sourcemaps for components. Use an object with `js` or `css` for more granular control of sourcemap generation. By default, this is `true`.
8587
| `outputFilename` | `null` | A `string` used for your JavaScript sourcemap.
8688
| `cssOutputFilename` | `null` | A `string` used for your CSS sourcemap.
8789
| `sveltePath` | `"svelte"` | The location of the `svelte` package. Any imports from `svelte` or `svelte/[module]` will be modified accordingly.

‎src/compiler/compile/Component.ts

Lines changed: 19 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@ import { clone } from '../utils/clone';
3636
import compiler_warnings from './compiler_warnings';
3737
import compiler_errors from './compiler_errors';
3838
import { extract_ignores_above_position, extract_svelte_ignore_from_comments } from '../utils/extract_svelte_ignore';
39+
import check_enable_sourcemap from './utils/check_enable_sourcemap';
3940

4041
interface ComponentOptions {
4142
namespace?: string;
@@ -343,21 +344,28 @@ export default class Component {
343344
? { code: null, map: null }
344345
: result.css;
345346

346-
const sourcemap_source_filename = get_sourcemap_source_filename(compile_options);
347+
const js_sourcemap_enabled = check_enable_sourcemap(compile_options.enableSourcemap, 'js');
347348

348-
js = print(program, {
349-
sourceMapSource: sourcemap_source_filename
350-
});
349+
if (!js_sourcemap_enabled) {
350+
js = print(program);
351+
js.map = null;
352+
} else {
353+
const sourcemap_source_filename = get_sourcemap_source_filename(compile_options);
351354

352-
js.map.sources = [
353-
sourcemap_source_filename
354-
];
355+
js = print(program, {
356+
sourceMapSource: sourcemap_source_filename
357+
});
355358

356-
js.map.sourcesContent = [
357-
this.source
358-
];
359+
js.map.sources = [
360+
sourcemap_source_filename
361+
];
359362

360-
js.map = apply_preprocessor_sourcemap(sourcemap_source_filename, js.map, compile_options.sourcemap as (string | RawSourceMap | DecodedSourceMap));
363+
js.map.sourcesContent = [
364+
this.source
365+
];
366+
367+
js.map = apply_preprocessor_sourcemap(sourcemap_source_filename, js.map, compile_options.sourcemap as (string | RawSourceMap | DecodedSourceMap));
368+
}
361369
}
362370

363371
return {

‎src/compiler/compile/index.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ const valid_options = [
1313
'name',
1414
'filename',
1515
'sourcemap',
16+
'enableSourcemap',
1617
'generate',
1718
'errorMode',
1819
'varsReport',
@@ -82,7 +83,7 @@ function validate_options(options: CompileOptions, warnings: Warning[]) {
8283
}
8384

8485
export default function compile(source: string, options: CompileOptions = {}) {
85-
options = Object.assign({ generate: 'dom', dev: false }, options);
86+
options = Object.assign({ generate: 'dom', dev: false, enableSourcemap: true }, options);
8687

8788
const stats = new Stats();
8889
const warnings = [];

‎src/compiler/compile/render_dom/index.ts

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { ImportDeclaration, ClassDeclaration, FunctionExpression, Node, Statemen
1010
import { apply_preprocessor_sourcemap } from '../../utils/mapped_code';
1111
import { RawSourceMap, DecodedSourceMap } from '@ampproject/remapping/dist/types/types';
1212
import { flatten } from '../../utils/flatten';
13+
import check_enable_sourcemap from '../utils/check_enable_sourcemap';
1314

1415
export default function dom(
1516
component: Component,
@@ -34,9 +35,15 @@ export default function dom(
3435

3536
const css = component.stylesheet.render(options.filename, !options.customElement);
3637

37-
css.map = apply_preprocessor_sourcemap(options.filename, css.map, options.sourcemap as string | RawSourceMap | DecodedSourceMap);
38+
const css_sourcemap_enabled = check_enable_sourcemap(options.enableSourcemap, 'css');
3839

39-
const styles = component.stylesheet.has_styles && options.dev
40+
if (css_sourcemap_enabled) {
41+
css.map = apply_preprocessor_sourcemap(options.filename, css.map, options.sourcemap as string | RawSourceMap | DecodedSourceMap);
42+
} else {
43+
css.map = null;
44+
}
45+
46+
const styles = css_sourcemap_enabled && component.stylesheet.has_styles && options.dev
4047
? `${css.code}\n/*# sourceMappingURL=${css.map.toUrl()} */`
4148
: css.code;
4249

@@ -521,7 +528,7 @@ export default function dom(
521528
constructor(options) {
522529
super();
523530
524-
${css.code && b`this.shadowRoot.innerHTML = \`<style>${css.code.replace(/\\/g, '\\\\')}${options.dev ? `\n/*# sourceMappingURL=${css.map.toUrl()} */` : ''}</style>\`;`}
531+
${css.code && b`this.shadowRoot.innerHTML = \`<style>${css.code.replace(/\\/g, '\\\\')}${css_sourcemap_enabled && options.dev ? `\n/*# sourceMappingURL=${css.map.toUrl()} */` : ''}</style>\`;`}
525532
526533
@init(this, { target: this.shadowRoot, props: ${init_props}, customElement: true }, ${definition}, ${has_create_fragment ? 'create_fragment' : 'null'}, ${not_equal}, ${prop_indexes}, null, ${dirty});
527534

‎src/compiler/compile/render_ssr/index.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { extract_names } from 'periscopic';
1010
import { walk } from 'estree-walker';
1111

1212
import { invalidate } from '../render_dom/invalidate';
13+
import check_enable_sourcemap from '../utils/check_enable_sourcemap';
1314

1415
export default function ssr(
1516
component: Component,
@@ -200,11 +201,13 @@ export default function ssr(
200201
main
201202
].filter(Boolean);
202203

204+
const css_sourcemap_enabled = check_enable_sourcemap(options.enableSourcemap, 'css');
205+
203206
const js = b`
204207
${css.code ? b`
205208
const #css = {
206209
code: "${css.code}",
207-
map: ${css.map ? string_literal(css.map.toString()) : 'null'}
210+
map: ${css_sourcemap_enabled && css.map ? string_literal(css.map.toString()) : 'null'}
208211
};` : null}
209212
210213
${component.extract_javascript(component.ast.module)}

‎src/compiler/compile/utils/check_enable_sourcemap.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import { EnableSourcemap } from '../../interfaces';
2+
3+
export default function check_enable_sourcemap(
4+
enable_sourcemap: EnableSourcemap,
5+
namespace: keyof Extract<EnableSourcemap, object>
6+
) {
7+
return typeof enable_sourcemap === 'boolean'
8+
? enable_sourcemap
9+
: enable_sourcemap[namespace];
10+
}

‎src/compiler/interfaces.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -131,6 +131,8 @@ export interface Warning {
131131

132132
export type ModuleFormat = 'esm' | 'cjs';
133133

134+
export type EnableSourcemap = boolean | { js: boolean; css: boolean };
135+
134136
export type CssHashGetter = (args: {
135137
name: string;
136138
filename: string | undefined;
@@ -147,6 +149,7 @@ export interface CompileOptions {
147149
varsReport?: 'full' | 'strict' | false;
148150

149151
sourcemap?: object | string;
152+
enableSourcemap?: EnableSourcemap;
150153
outputFilename?: string;
151154
cssOutputFilename?: string;
152155
sveltePath?: string;

‎test/sourcemaps/index.ts

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -85,11 +85,13 @@ describe('sourcemaps', () => {
8585
);
8686
}
8787

88-
assert.deepEqual(
89-
js.map.sources.slice().sort(),
90-
(config.js_map_sources || ['input.svelte']).sort(),
91-
'js.map.sources is wrong'
92-
);
88+
if (js.map) {
89+
assert.deepEqual(
90+
js.map.sources.slice().sort(),
91+
(config.js_map_sources || ['input.svelte']).sort(),
92+
'js.map.sources is wrong'
93+
);
94+
}
9395
if (css.map) {
9496
assert.deepEqual(
9597
css.map.sources.slice().sort(),

‎test/sourcemaps/samples/no-sourcemap/_config.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
export default {
2+
compile_options: {
3+
enableSourcemap: false
4+
}
5+
};

‎test/sourcemaps/samples/no-sourcemap/input.svelte

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<script>
2+
export let foo;
3+
</script>
4+
5+
<p>{foo}</p>
6+
7+
<style>
8+
p {
9+
color: red;
10+
}
11+
</style>

0 commit comments

Comments
 (0)