feat: 🎸 support defining default languages

✅ Closes: #189

Author: kaisermann

Diff for: src/autoProcess.ts

@@ -12,13 +12,20 @@ import {
 import { hasDepInstalled } from './modules/hasDepInstalled';
 import { concat } from './modules/concat';
 import { parseFile } from './modules/parseFile';
-import { addLanguageAlias } from './modules/language';
+import { addLanguageAlias, getLanguageFromAlias } from './modules/language';
 import { throwError } from './modules/errors';
 
 type AutoPreprocessOptions = {
   markupTagName?: string;
   aliases?: Array<[string, string]>;
   preserve?: string[];
+  defaults?: {
+    markup?: string;
+    style?: string;
+    script?: string;
+  };
+
+  // transformers
   typescript?: TransformerOptions<Options.Typescript>;
   scss?: TransformerOptions<Options.Sass>;
   sass?: TransformerOptions<Options.Sass>;
@@ -27,7 +34,7 @@ type AutoPreprocessOptions = {
   postcss?: TransformerOptions<Options.Postcss>;
   coffeescript?: TransformerOptions<Options.Coffeescript>;
   pug?: TransformerOptions<Options.Pug>;
-  globalStyle?: Options.GlobalStyle;
+  globalStyle?: Options.GlobalStyle | boolean;
   replace?: Options.Replace;
   // workaround while we don't have this
   // https://github.com/microsoft/TypeScript/issues/17867
@@ -50,6 +57,10 @@ export const runTransformer = async (
   options: TransformerOptions,
   { content, map, filename, attributes }: TransformerArgs<any>,
 ): Promise<Processed> => {
+  if (options === false) {
+    return { code: content };
+  }
+
   // remove any unnecessary indentation (useful for coffee, pug and sugarss)
   content = stripIndent(content);
 
@@ -79,11 +90,19 @@ export function autoPreprocess(
     aliases,
     markupTagName = 'template',
     preserve = [],
+    defaults,
     ...rest
   }: AutoPreprocessOptions = {} as AutoPreprocessOptions,
 ): PreprocessorGroup {
   markupTagName = markupTagName.toLocaleLowerCase();
 
+  const defaultLanguages = {
+    markup: 'html',
+    style: 'css',
+    script: 'javascript',
+    ...defaults,
+  };
+
   const transformers = rest as Transformers;
   const markupPattern = new RegExp(
     `<${markupTagName}([\\s\\S]*?)(?:>([\\s\\S]*)<\\/${markupTagName}>|/>)`,
@@ -119,27 +138,29 @@ export function autoPreprocess(
     return (optionsCache[alias] = opts);
   };
 
-  const getTransformerTo = (targetLanguage: string): Preprocessor => async (
-    svelteFile,
-  ) => {
-    const {
+  const getTransformerTo = (
+    type: 'markup' | 'script' | 'style',
+    targetLanguage: string,
+  ): Preprocessor => async (svelteFile) => {
+    let {
       content,
       filename,
       lang,
       alias,
       dependencies,
       attributes,
-    } = await parseFile(svelteFile, targetLanguage);
+    } = await parseFile(svelteFile);
+
+    if (lang == null || alias == null) {
+      alias = defaultLanguages[type];
+      lang = getLanguageFromAlias(alias);
+    }
 
     if (preserve.includes(lang) || preserve.includes(alias)) {
       return;
     }
 
-    if (
-      lang === targetLanguage ||
-      transformers[lang] === false ||
-      transformers[alias] === false
-    ) {
+    if (lang === targetLanguage) {
       return { code: content, dependencies };
     }
 
@@ -155,9 +176,9 @@ export function autoPreprocess(
     };
   };
 
-  const scriptTransformer = getTransformerTo('javascript');
-  const cssTransformer = getTransformerTo('css');
-  const markupTransformer = getTransformerTo('html');
+  const scriptTransformer = getTransformerTo('script', 'javascript');
+  const cssTransformer = getTransformerTo('style', 'css');
+  const markupTransformer = getTransformerTo('markup', 'html');
 
   return {
     async markup({ content, filename }) {

Diff for: src/modules/language.ts

@@ -15,26 +15,27 @@ export const ALIAS_MAP = new Map([
 export const addLanguageAlias = (entries: Array<[string, string]>) =>
   entries.forEach((entry) => ALIAS_MAP.set(...entry));
 
-export const getLanguage = (
-  attributes: PreprocessorArgs['attributes'],
-  defaultLang: string,
-) => {
-  let lang = defaultLang;
+export const getLanguageFromAlias = (alias: string | null) => {
+  return ALIAS_MAP.get(alias) || alias;
+};
+
+export const getLanguage = (attributes: PreprocessorArgs['attributes']) => {
+  let alias = null;
 
   if (attributes.lang) {
     // istanbul ignore if
     if (typeof attributes.lang !== 'string') {
       throw new Error('lang attribute must be string');
     }
 
-    lang = attributes.lang;
+    alias = attributes.lang;
   } else if (attributes.type) {
     // istanbul ignore if
     if (typeof attributes.type !== 'string') {
       throw new Error('type attribute must be string');
     }
 
-    lang = attributes.type.replace(/^(text|application)\/(.*)$/, '$2');
+    alias = attributes.type.replace(/^(text|application)\/(.*)$/, '$2');
   } else if (attributes.src) {
     // istanbul ignore if
     if (typeof attributes.src !== 'string') {
@@ -43,11 +44,13 @@ export const getLanguage = (
 
     const parts = basename(attributes.src).split('.');
 
-    lang = parts.length > 1 ? parts.pop() : defaultLang;
+    if (parts.length > 1) {
+      alias = parts.pop();
+    }
   }
 
   return {
-    lang: ALIAS_MAP.get(lang) || lang,
-    alias: lang,
+    lang: getLanguageFromAlias(alias),
+    alias,
   };
 };

Diff for: src/modules/parseFile.ts

@@ -21,10 +21,11 @@ async function doesFileExist(file: string) {
   return new Promise((resolve) => access(file, 0, (err) => resolve(!err)));
 }
 
-export const parseFile = async (
-  { attributes, filename, content }: PreprocessorArgs,
-  language: string,
-) => {
+export const parseFile = async ({
+  attributes,
+  filename,
+  content,
+}: PreprocessorArgs) => {
   const dependencies = [];
 
   /** only include src file if content of tag is empty */
@@ -48,7 +49,7 @@ export const parseFile = async (
     }
   }
 
-  const { lang, alias } = getLanguage(attributes, language);
+  const { lang, alias } = getLanguage(attributes);
 
   return {
     filename,

Diff for: test/autoProcess/autoProcess.test.ts

@@ -13,7 +13,6 @@ describe('detect - mimetype', () => {
     { type: 'text/some-other', targetLanguage: 'some-other' },
     { lang: 'stylus', targetLanguage: 'stylus' },
     { src: '../foo.js', targetLanguage: 'javascript' },
-    { src: '../foo', targetLanguage: 'javascript' },
     {
       src: '../foo.custom',
       lang: 'customLanguage',
@@ -25,7 +24,7 @@ describe('detect - mimetype', () => {
     it(`should detect '${
       src || type || lang
     }' as '${targetLanguage}'`, async () => {
-      const language = getLanguage({ type, lang, src }, targetLanguage);
+      const language = getLanguage({ type, lang, src });
 
       expect(language).toMatchObject({ lang: targetLanguage });
     });
@@ -137,4 +136,32 @@ describe('options', () => {
 
     expect(await doesCompileThrow(input, opts)).toBe(true);
   });
+
+  it('should accept other languages as default', async () => {
+    const input = `<template>markup</template><style>style</style><script>script</script>`;
+
+    const opts = getAutoPreprocess({
+      defaults: {
+        markup: 'customMarkup',
+        script: 'customScript',
+        style: 'customStyle',
+      },
+      globalStyle: false,
+      customMarkup({ content }) {
+        return { code: content.replace('markup', 'potato') };
+      },
+      customScript({ content }) {
+        return { code: content.replace('script', 'potato') };
+      },
+      customStyle({ content }) {
+        return { code: content.replace('style', 'potato') };
+      },
+    });
+
+    const preprocessed = await preprocess(input, opts);
+
+    expect(preprocessed.toString()).toContain(
+      'potato<style>potato</style><script>potato</script>',
+    );
+  });
 });

Diff for: test/modules.test.ts

@@ -75,24 +75,18 @@ describe('globalifySelector', () => {
 
 describe(`parse svelte file`, () => {
   it('should only include src files if content is empty', async () => {
-    let parsedFile = await parseFile(
-      {
-        content: '',
-        attributes: { src: './fixtures/style.scss' },
-        filename: getTestAppFilename(),
-      },
-      'css',
-    );
+    let parsedFile = await parseFile({
+      content: '',
+      attributes: { src: './fixtures/style.scss' },
+      filename: getTestAppFilename(),
+    });
 
     expect(parsedFile.content).toEqual(getFixtureContent('style.scss'));
 
-    parsedFile = await parseFile(
-      {
-        ...parsedFile,
-        attributes: { src: './fixtures/style.css' },
-      },
-      'css',
-    );
+    parsedFile = await parseFile({
+      ...parsedFile,
+      attributes: { src: './fixtures/style.css' },
+    });
 
     expect(parsedFile.content).toEqual(getFixtureContent('style.scss'));
   });