feat(processors): civet

README.md

@@ -1,6 +1,6 @@
 # Svelte Preprocess
 
-> A [Svelte](https://svelte.dev) preprocessor with sensible defaults and support for: PostCSS, SCSS, Less, Stylus, CoffeeScript, TypeScript, Pug and much more.
+> A [Svelte](https://svelte.dev) preprocessor with sensible defaults and support for: PostCSS, SCSS, Less, Stylus, CoffeeScript, TypeScript, Civet, Pug and much more.
 
 <p>
   <a href="https://www.npmjs.com/package/svelte-preprocess">
@@ -176,7 +176,7 @@ into
 
 ### Built-in support for commonly used languages
 
-The current supported languages out-of-the-box are Sass, Stylus, Less, CoffeeScript, TypeScript, Pug, PostCSS, Babel.
+The current supported languages out-of-the-box are Sass, Stylus, Less, CoffeeScript, TypeScript, Civet, Pug, PostCSS, Babel.
 
 ```html
 <template lang="pug">

docs/getting-started.md

@@ -28,6 +28,7 @@ $ npm install -D svelte-preprocess
 - Babel: `npm install -D @babel/core @babel/preset-...`
 - CoffeeScript: `npm install -D coffeescript`
 - TypeScript: `npm install -D typescript`
+- Civet: `npm install -D @danielx/civet`
 - PostCSS: `npm install -D postcss postcss-load-config`
 - SugarSS: `npm install -D postcss sugarss`
 - Less: `npm install -D less`
@@ -70,7 +71,7 @@ export default {
 }
 ```
 
-Now our app's code can be written in any of the syntaxes supported by `svelte-preprocess`: Sass, Stylus, Less, CoffeeScript, TypeScript, Pug, PostCSS, Babel.
+Now our app's code can be written in any of the syntaxes supported by `svelte-preprocess`: Sass, Stylus, Less, CoffeeScript, TypeScript, Civet, Pug, PostCSS, Babel.
 
 _**Note:** If you use VS Code, check [its usage guide](/docs/usage.md#with-svelte-vs-code) to make the Svelte VS Code extension understand the content of your components._
 

docs/preprocessing.md

@@ -11,6 +11,7 @@
 - [Preprocessors](#preprocessors)
   - [Babel](#babel)
   - [CoffeeScript](#coffeescript)
+  - [Civet](#civet)
   - [Less](#less)
   - [PostCSS, SugarSS](#postcss-sugarss)
   - [Pug](#pug)
@@ -96,6 +97,7 @@ export default {
         babel: { ... },
         postcss: { ... },
         coffeescript: { ... },
+        civet: { ... },
         pug: { ... },
       }),
     }),
@@ -203,6 +205,7 @@ import {
   pug,
   coffeescript,
   typescript,
+  civet,
   less,
   scss,
   sass,
@@ -221,6 +224,7 @@ export default {
         pug({ ... }),
         coffeescript({ ... }),
         typescript({ ... }),
+        civet({ ... }),
         less({ ... }),
         scss({ ... }),
         sass({ ... }),
@@ -256,6 +260,10 @@ _Note: If you want to transpile your app to be supported in older browsers, you
 
 The CoffeeScript processor accepts no extra options and only transpiles CoffeeScript code down to esm compliant JavaScript code.
 
+### Civet
+
+The Civet processor accepts no extra options and only transpiles Civet code down to esm compliant JavaScript code.
+
 ### Less
 
 You can check the [Less API reference](http://lesscss.org/usage/#less-options) for Less specific options.

package.json

@@ -62,6 +62,7 @@
     "@babel/preset-env": "^7.23.6",
     "@commitlint/cli": "^11.0.0",
     "@commitlint/config-conventional": "^11.0.0",
+    "@danielx/civet": "^0.6.83",
     "@kiwi/eslint-config": "^2.0.2",
     "@kiwi/prettier-config": "^2.0.2",
     "@types/babel__core": "^7.20.5",
@@ -98,6 +99,7 @@
   },
   "peerDependencies": {
     "@babel/core": "^7.10.2",
+    "@danielx/civet": "^0.6.83",
     "coffeescript": "^2.5.1",
     "less": "^3.11.3 || ^4.0.0",
     "postcss": "^7 || ^8",
@@ -113,6 +115,9 @@
     "@babel/core": {
       "optional": true
     },
+    "@danielx/civet": {
+      "optional": true
+    },
     "coffeescript": {
       "optional": true
     },

src/index.ts

@@ -10,6 +10,7 @@ export default exports = module.exports = sveltePreprocess;
 export { default as pug } from './processors/pug';
 export { default as coffeescript } from './processors/coffeescript';
 export { default as typescript } from './processors/typescript';
+export { default as civet } from './processors/civet';
 export { default as less } from './processors/less';
 export { default as scss, default as sass } from './processors/scss';
 export { default as stylus } from './processors/stylus';

src/modules/language.ts

@@ -15,6 +15,9 @@ const LANGUAGE_DEFAULTS: Record<string, any> = {
   coffeescript: {
     stripIndent: true,
   },
+  civet: {
+    stripIndent: true,
+  },
   stylus: {
     stripIndent: true,
   },
@@ -36,6 +39,7 @@ export const ALIAS_MAP = new Map([
   ['js', 'javascript'],
   ['coffee', 'coffeescript'],
   ['ts', 'typescript'],
+  ['civet', 'civet'],
 ]);
 
 export const SOURCE_MAP_PROP_MAP: Record<string, [string[], any]> = {

src/processors/civet.ts

@@ -0,0 +1,38 @@
+import { getTagInfo } from '../modules/tagInfo';
+import { concat } from '../modules/utils';
+import { prepareContent } from '../modules/prepareContent';
+
+import type { PreprocessorGroup, Options } from '../types';
+
+export default (options?: Options.Civet): PreprocessorGroup => ({
+  async script(svelteFile) {
+    const { transformer } = await import('../transformers/civet');
+
+    let { content, filename, attributes, lang, dependencies } =
+      await getTagInfo(svelteFile);
+
+    if (lang !== 'civet') {
+      return { code: content };
+    }
+
+    content = prepareContent({
+      options: {
+        ...options,
+        stripIndent: true,
+      },
+      content,
+    });
+
+    const transformed = await transformer({
+      content,
+      filename,
+      attributes,
+      options,
+    });
+
+    return {
+      ...transformed,
+      dependencies: concat(dependencies, transformed.dependencies),
+    };
+  },
+});

src/transformers/civet.ts

@@ -0,0 +1,27 @@
+import civet from '@danielx/civet';
+
+import type { Transformer, Options } from '../types';
+
+const transformer: Transformer<Options.Civet> = ({
+  content,
+  filename,
+  options,
+}) => {
+  const civetOptions = {
+    filename,
+    js: false,
+    ...options,
+  } as Omit<Options.Civet, 'bare'>;
+
+  if (civetOptions.sourceMap) {
+    const compiledTS = civet.compile(content, civetOptions);
+
+    const map = JSON.parse(compiledTS);
+
+    return { code: compiledTS, map };
+  }
+
+  return { code: civet.compile(content, civetOptions) };
+};
+
+export { transformer };

src/types/options.ts

@@ -2,6 +2,7 @@ import type { LegacyStringOptions } from 'sass';
 import type * as postcss from 'postcss';
 import type { Options as PugOptions } from 'pug';
 import type { TransformOptions as BabelOptions } from '@babel/core';
+import type { ParseOptions } from '@danielx/civet';
 
 type ContentModifier = {
   prependData?: string;
@@ -18,6 +19,13 @@ export type Coffeescript = {
   bare?: never;
 } & ContentModifier;
 
+export type Civet = {
+  filename?: string;
+  js?: boolean;
+  sourceMap?: boolean;
+  parseOptions?: ParseOptions;
+} & ContentModifier;
+
 export type Postcss = postcss.ProcessOptions & {
   plugins?: postcss.AcceptedPlugin[];
   // custom

test/fixtures/script.civet

@@ -0,0 +1 @@
+export hello = 'world';