wip(vue2): add template preprocessor support

Author: Toilal

src/createVue2SFCModule.ts

@@ -68,7 +68,7 @@ export async function createSFCModule(source : string, filename : string, option
 	const component = {};
 
 
-	const { compiledCache, addStyle, log, additionalBabelPlugins = [], customBlockHandler } = options;
+	const { moduleCache, compiledCache, addStyle, log, additionalBabelPlugins = [], customBlockHandler } = options;
 
 	// vue-loader next: https://github.com/vuejs/vue-loader/blob/next/src/index.ts#L91
 	const descriptor = sfc_parse({
@@ -105,11 +105,16 @@ export async function createSFCModule(source : string, filename : string, option
 			scopeId: hasScoped ? scopeId : null,
 			comments: true
 		} as any,
-		preprocessLang: descriptor.template.lang,
 		isProduction: isProd,
 		prettify: false
 	} : null;
 
+	// Vue2 doesn't support preprocessCustomRequire, so we have to preprocess manually
+	if (descriptor.template?.lang) {
+		const preprocess = moduleCache[descriptor.template.lang] as any
+		compileTemplateOptions.source = preprocess.render(compileTemplateOptions.source, compileTemplateOptions.preprocessOptions)
+	}
+
 	if ( descriptor.script ) {
 
 		// eg: https://github.com/vuejs/vue-loader/blob/v15.9.6/lib/index.js

tests/basic.test.js

@@ -513,5 +513,30 @@ const { defaultFilesVue2, defaultFiles, createPage } = require('./testsTools.js'
 
 				await page.close();
 			});
+
+			test('custom template language', async () => {
+				const { page, output } = await createPage({
+					files: {
+						...files,
+						'/component.vue': `
+							<template lang="custom">
+								<span>Hello World !</span>
+							</template>
+						`,
+						'/optionsOverride.js': `
+							export default (options) => {
+								options.moduleCache.custom = {render: s => s.replace("Hello World !", "Custom Hello World !") }
+							};
+						`,
+					}
+				});
+
+				await expect(page.$eval('#app', el => el.textContent.trim())).resolves.toBe('Custom Hello World !');
+
+				await page.close();
+			});
+
 	});
+
+
 })