Add support for svelte files.

Author: patrickcjh

README.md

@@ -69,6 +69,8 @@ yarn add --dev @trivago/prettier-plugin-sort-imports
 
 **Note: If formatting `.vue` sfc files please install `@vue/compiler-sfc` if not in your dependency tree - this normally is within Vue projects.**
 
+**Note: If formatting `.svelte` sfc files please install `prettier-plugin-svelte` and configure it in the Prettier plugin before this plugin - this normally is within Svelte projects.**
+
 ### Usage
 
 Add an order in prettier config file.
@@ -222,7 +224,7 @@ Having some trouble or an issue ? You can check [FAQ / Troubleshooting section](
 | React                  | ✅ Everything            | -                                                |
 | Angular                | ✅ Everything            | Supported through `importOrderParserPlugins` API |
 | Vue                    | ✅ Everything            | `@vue/compiler-sfc` is required                  |
-| Svelte                 | ⚠️ Soon to be supported.  | Any contribution is welcome.                     |
+| Svelte                 | ✅ Everything            | `prettier-plugin-svelte` is required             |
 
 ### Used by
 

package.json

@@ -49,16 +49,21 @@
     "@vue/compiler-sfc": "^3.2.41",
     "jest": "26.6.3",
     "prettier": "2.8",
+    "prettier-plugin-svelte": "^3.2.6",
     "ts-jest": "26.5.3",
     "typescript": "4.9.4"
   },
   "peerDependencies": {
     "@vue/compiler-sfc": "3.x",
-    "prettier": "2.x - 3.x"
+    "prettier": "2.x - 3.x",
+    "prettier-plugin-svelte": "3.x"
   },
   "peerDependenciesMeta": {
     "@vue/compiler-sfc": {
       "optional": true
+    },
+    "prettier-plugin-svelte": {
+      "optional": true
     }
   }
 }

src/index.ts

@@ -6,6 +6,23 @@ import { parsers as typescriptParsers } from 'prettier/parser-typescript';
 import { defaultPreprocessor } from './preprocessors/default-processor';
 import { vuePreprocessor } from './preprocessors/vue-preprocessor';
 
+const svelteParsers = createSvelteParsers();
+
+function createSvelteParsers() {
+    try {
+        var { parsers } = require('prettier-plugin-svelte');
+        var { sveltePreprocessor } = require('./preprocessors/svelte-preprocessor');
+    } catch {
+        return {};
+    }
+    return {
+        svelte: {
+            ...parsers.svelte,
+            preprocess: sveltePreprocessor,
+        },
+    };
+}
+
 const options = {
     importOrder: {
         type: 'path',
@@ -68,6 +85,7 @@ module.exports = {
             ...htmlParsers.vue,
             preprocess: vuePreprocessor,
         },
+        ...svelteParsers,
     },
     options,
 };

src/preprocessors/svelte-preprocessor.ts

@@ -0,0 +1,17 @@
+import { PrettierOptions } from '../types';
+import { preprocessor } from './preprocessor';
+
+const { parsers } = require('prettier-plugin-svelte');
+const scriptRegex =
+    /<!--[^]*?-->|<script((?:\s+[^=>'"\/\s]+=(?:"[^"]*"|'[^']*'|[^>\s]+)|\s+[^=>'"\/\s]+)*\s*)>([^]*?)<\/script>/g;
+
+export function sveltePreprocessor(code: string, options: PrettierOptions) {
+    code = code.replace(scriptRegex, (match, attributes, content, index) => {
+        if (match.startsWith('<!--')) {
+            return match;
+        }
+        content = preprocessor(content, options);
+        return `<script${attributes}>${content}</script>`;
+    });
+    return parsers.svelte.preprocess(code, options);
+}

yarn.lock

@@ -2955,6 +2955,11 @@ prelude-ls@~1.1.2:
   resolved "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz"
   integrity "sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ=sha512-ESF23V4SKG6lVSGZgYNpbsiaAkdab6ZgOxe52p7+Kid3W3u3bxR4Vfd/o21dmN7jSt0IwgZ4v5MUd26FEtXE9w== sha512-ESF23V4SKG6lVSGZgYNpbsiaAkdab6ZgOxe52p7+Kid3W3u3bxR4Vfd/o21dmN7jSt0IwgZ4v5MUd26FEtXE9w=="
 
+prettier-plugin-svelte@^3.2.6:
+  version "3.2.7"
+  resolved "https://registry.yarnpkg.com/prettier-plugin-svelte/-/prettier-plugin-svelte-3.2.7.tgz#10db2d553b48c6ed412e2d00688f8d2eaa274f8a"
+  integrity sha512-/Dswx/ea0lV34If1eDcG3nulQ63YNr5KPDfMsjbdtpSWOxKKJ7nAc2qlVuYwEvCr4raIuredNoR7K4JCkmTGaQ==
+
 prettier@2.8:
   version "2.8.0"
   resolved "https://registry.npmjs.org/prettier/-/prettier-2.8.0.tgz"