diff --git a/site/content/docs/04-compile-time.md b/site/content/docs/04-compile-time.md index 755985520d..9aba272bb6 100644 --- a/site/content/docs/04-compile-time.md +++ b/site/content/docs/04-compile-time.md @@ -312,6 +312,51 @@ const { code } = await svelte.preprocess(source, [ }); ``` +An additional level of nesting allows more control over the timing of subsequent `markup` functions. + +```js +const svelte = require('svelte/compiler'); + +const { code } = await svelte.preprocess(source, [ + [ + { + markup: () => { + console.log('this runs first'); + }, + script: () => { + console.log('this runs third'); + }, + style: () => { + console.log('this runs fifth'); + } + }, + { + markup: () => { + console.log('this runs second'); + }, + script: () => { + console.log('this runs fourth'); + }, + style: () => { + console.log('this runs sixth'); + } + } + ], + { + markup: () => { + console.log('this runs seventh'); + }, + script: () => { + console.log('this runs eighth'); + }, + style: () => { + console.log('this runs ninth'); + } + } +], { + filename: 'App.svelte' +}); +``` ### `svelte.walk` diff --git a/src/compiler/preprocess/index.ts b/src/compiler/preprocess/index.ts index 93b48996c1..1cf27b9f04 100644 --- a/src/compiler/preprocess/index.ts +++ b/src/compiler/preprocess/index.ts @@ -195,27 +195,51 @@ async function process_markup(filename: string, process: MarkupPreprocessor, sou } } -export default async function preprocess( - source: string, - preprocessor: PreprocessorGroup | PreprocessorGroup[], - options?: { filename?: string } -): Promise { - // @ts-ignore todo: doublecheck - const filename = (options && options.filename) || preprocessor.filename; // legacy +function ensureArray(x: T): T extends readonly any[] ? T : T[] { + // @ts-ignore + return Array.isArray(x)? x : [x]; +} - const preprocessors = preprocessor ? (Array.isArray(preprocessor) ? preprocessor : [preprocessor]) : []; +function groupPreprocessors(preprocessorsIn: Array): PreprocessorGroup[][] { + const preprocessors = { completed: [], building: [] }; - const markup = preprocessors.map(p => p.markup).filter(Boolean); - const script = preprocessors.map(p => p.script).filter(Boolean); - const style = preprocessors.map(p => p.style).filter(Boolean); + function cleanUpBuilding() { + if (preprocessors.building.length) { + preprocessors.completed.push(preprocessors.building); + preprocessors.building = []; + } + } - const result = new PreprocessResult(source, filename); + for (const current of preprocessorsIn) { + if (Array.isArray(current)) { + cleanUpBuilding(); + preprocessors.completed.push(current); + } else { + preprocessors.building.push(current); + } + } + + cleanUpBuilding(); + + return preprocessors.completed; + +} + +async function preprocessGrouped( + result: T, + preprocessorGroup: PreprocessorGroup[]|PreprocessorGroup +): Promise { + const preprocessors = ensureArray(preprocessorGroup); + + const markup = preprocessors.map((p) => p.markup).filter(Boolean); + const script = preprocessors.map((p) => p.script).filter(Boolean); + const style = preprocessors.map((p) => p.style).filter(Boolean); // TODO keep track: what preprocessor generated what sourcemap? // to make debugging easier = detect low-resolution sourcemaps in fn combine_mappings for (const process of markup) { - result.update_source(await process_markup(filename, process, result)); + result.update_source(await process_markup(result.filename, process, result)); } for (const process of script) { @@ -226,5 +250,21 @@ export default async function preprocess( result.update_source(await process_tag('style', preprocess, result)); } + return; +} + +export default async function preprocess( + source: string, + preprocessor: PreprocessorGroup | Array = [], + options?: { filename?: string } +): Promise { + // @ts-ignore todo: doublecheck + const filename = (options && options.filename) || preprocessor.filename; // legacy + const result = new PreprocessResult(source, filename); + + for (const preprocessorGrouping of groupPreprocessors(ensureArray(preprocessor))) { + await preprocessGrouped(result, preprocessorGrouping); + } + return result.to_processed(); } diff --git a/test/preprocess/samples/multiple-preprocessors-grouped/_config.js b/test/preprocess/samples/multiple-preprocessors-grouped/_config.js new file mode 100644 index 0000000000..8e6a1040b1 --- /dev/null +++ b/test/preprocess/samples/multiple-preprocessors-grouped/_config.js @@ -0,0 +1,37 @@ +export default { + preprocess: [ + [ + { + markup: ({ content }) => ({ code: content.replace(/one/g, 'two') }), + script: ({ content }) => ({ code: content.replace(/three/g, 'four') }), + style: ({ content }) => ({ code: content.replace(/four/g, 'nine') }) + }, + { + markup: ({ content }) => ({ code: content.replace(/two/g, 'three') }), + script: ({ content }) => ({ code: content.replace(/four/g, 'five') }), + style: ({ content }) => ({ code: content.replace(/three/g, 'four') }) + } + ], + { + markup: ({ content }) => ({ code: content.replace(/three|four|five/g, 'reset-markup') }), + script: ({ content }) => ({ code: content.replace(/reset-markup/g, 'reset-script') }), + style: ({ content }) => ({ code: content.replace(/reset-markup/g, 'reset-style') }) + }, + [ + { + markup: ({ content }) => ({ + code: content + .replace(/reset-markup/, 'six') + .replace(/reset-style/, 'six') + .replace(/reset-script/, 'six') }), + script: ({ content }) => ({ code: content.replace(/seven/g, 'eight') }), + style: ({ content }) => ({ code: content.replace(/eight/g, 'nine') }) + }, + { + markup: ({ content }) => ({ code: content.replace(/six/g, 'seven') }), + script: ({ content }) => ({ code: content.replace(/eight/g, 'nine') }), + style: ({ content }) => ({ code: content.replace(/seven/g, 'eight') }) + } + ] + ] +}; diff --git a/test/preprocess/samples/multiple-preprocessors-grouped/input.svelte b/test/preprocess/samples/multiple-preprocessors-grouped/input.svelte new file mode 100644 index 0000000000..6dbbfb47a9 --- /dev/null +++ b/test/preprocess/samples/multiple-preprocessors-grouped/input.svelte @@ -0,0 +1,11 @@ +

one

+ + + + \ No newline at end of file diff --git a/test/preprocess/samples/multiple-preprocessors-grouped/output.svelte b/test/preprocess/samples/multiple-preprocessors-grouped/output.svelte new file mode 100644 index 0000000000..fbe3250348 --- /dev/null +++ b/test/preprocess/samples/multiple-preprocessors-grouped/output.svelte @@ -0,0 +1,11 @@ +

seven

+ + + + \ No newline at end of file