prettier-plugin-svelte - npm Package Compare versions

Comparing version 0.2.0 to 0.3.0

package.json

 {
     "name": "prettier-plugin-svelte",
-    "version": "0.2.0",
+    "version": "0.3.0",
     "description": "Svelte plugin for prettier",
@@ -27,3 +27,3 @@ "main": "plugin.js",
         "prettier": "^1.16.1",
-        "svelte": "2.16.0",
+        "svelte": "^2.0.0 || ^3.0.0-alpha",
         "tslib": "^1.9.3"
@@ -39,2 +39,4 @@ },
         "rollup-plugin-typescript": "1.0.0",
+        "test-svelte2": "npm:svelte@2.16.0",
+        "test-svelte3": "npm:svelte@3.0.0-alpha27",
         "ts-node": "^7.0.1",
@@ -41,0 +43,0 @@ "typescript": "3.2.4"

plugin.js

@@ -5,9 +5,66 @@ 'use strict';
 
-var svelte = require('svelte');
 var prettier = require('prettier');
 
 function isASTNode(n) {
-    return 'html' in n && 'css' in n && 'js' in n;
+    return 'html' in n && 'tokens' in n;
 }
 
+function extractAttributes(html) {
+    const extractAttributesRegex = /<[a-z]+\s*(.*?)>/i;
+    const attributeRegex = /([^\s=]+)(?:=("|')(.*?)\2)?/gi;
+    const [, attributesString] = html.match(extractAttributesRegex);
+    const attrs = [];
+    let match;
+    while ((match = attributeRegex.exec(attributesString))) {
+        const [all, name, quotes, value] = match;
+        const attrStart = match.index;
+        let valueNode;
+        if (!value) {
+            valueNode = true;
+        }
+        else {
+            let valueStart = attrStart + name.length;
+            if (quotes) {
+                valueStart += 2;
+            }
+            valueNode = [
+                {
+                    type: 'Text',
+                    data: value,
+                    start: valueStart,
+                    end: valueStart + value.length,
+                },
+            ];
+        }
+        attrs.push({
+            type: 'Attribute',
+            name,
+            value: valueNode,
+            start: attrStart,
+            end: attrStart + all.length,
+        });
+    }
+    return attrs;
+}
+
+function getText(node, options) {
+    return options.originalText.slice(options.locStart(node), options.locEnd(node));
+}
+
+function isBindingNodeV2(node) {
+    return node.type === 'Binding' && 'value' in node;
+}
+
+function getSvelteVersion(importPath) {
+    const { version } = require(`${importPath}/package.json`);
+    const [major, minor, misc] = version.split('.');
+    const [patch, label] = misc.split('-');
+    return {
+        major: Number(major),
+        minor: Number(minor),
+        patch: Number(patch),
+        label,
+    };
+}
+
 const { concat, join, line, group, indent, softline, hardline } = prettier.doc.builders;
@@ -30,4 +87,19 @@ function print(path, options, print) {
         }
+        if (n.instance) {
+            n.instance.type = 'Script';
+            n.instance.attributes = extractAttributes(getText(n.instance, options));
+            parts.push(path.call(print, 'instance'));
+        }
+        if (n.module) {
+            n.module.type = 'Script';
+            n.module.attributes = extractAttributes(getText(n.module, options));
+            parts.push(path.call(print, 'module'));
+        }
         return group(join(hardline, parts));
     }
+    const version = getSvelteVersion(options.sveltePath);
+    let [open, close] = ['{', '}'];
+    if (version.major < 3) {
+        [open, close] = ['"', '"'];
+    }
     const node = n;
@@ -191,5 +263,17 @@ switch (node.type) {
                 node.name,
-                node.expression ? concat(['=', '"', printJS(path, print, 'expression'), '"']) : '',
+                node.expression
+                    ? concat(['=', open, printJS(path, print, 'expression'), close])
+                    : '',
             ]);
         case 'Binding':
+            if (isBindingNodeV2(node)) {
+                return concat([
+                    line,
+                    'bind:',
+                    node.name,
+                    node.value.type === 'Identifier' && node.value.name === node.name
+                        ? ''
+                        : concat(['=', open, printJS(path, print, 'value'), close]),
+                ]);
+            }
             return concat([
@@ -199,5 +283,5 @@ line,
                 node.name,
-                node.value.type === 'Identifier' && node.value.name === node.name
+                node.expression.type === 'Identifier' && node.expression.name === node.name
                     ? ''
-                    : concat(['=', '"', printJS(path, print, 'value'), '"']),
+                    : concat(['=', '{', printJS(path, print, 'expression'), '}']),
             ]);
@@ -223,3 +307,5 @@ case 'DebugTag':
                 node.name,
-                node.expression ? concat(['=', '"', printJS(path, print, 'expression'), '"']) : '',
+                node.expression
+                    ? concat(['=', open, printJS(path, print, 'expression'), close])
+                    : '',
             ]);
@@ -231,3 +317,5 @@ case 'Action':
                 node.name,
-                node.expression ? concat(['=', '"', printJS(path, print, 'expression'), '"']) : '',
+                node.expression
+                    ? concat(['=', open, printJS(path, print, 'expression'), close])
+                    : '',
             ]);
@@ -239,3 +327,5 @@ case 'Animation':
                 node.name,
-                node.expression ? concat(['=', '"', printJS(path, print, 'expression'), '"']) : '',
+                node.expression
+                    ? concat(['=', open, printJS(path, print, 'expression'), close])
+                    : '',
             ]);
@@ -339,5 +429,2 @@ case 'RawMustacheTag':
 }
-function getText(node, options) {
-    return options.originalText.slice(options.locStart(node), options.locEnd(node));
-}
 function expressionParser(text, parsers) {
@@ -414,2 +501,15 @@ const ast = parsers.babylon(`(${text})`);
 
+function importSvelte(importPath) {
+    const version = getSvelteVersion(importPath);
+    if (version.major <= 2) {
+        return require(importPath);
+    }
+    const svelte = require(`${importPath}/compiler`);
+    return {
+        parse(text) {
+            return svelte.compile(text, { generate: false, onwarn: () => undefined }).ast;
+        },
+    };
+}
+
 function locStart(node) {
@@ -430,6 +530,10 @@ return node.start;
     svelte: {
-        parse: (text) => {
+        parse: (text, parsers, options) => {
+            const { parse } = importSvelte(options.sveltePath);
+            return parse(text);
+        },
+        preprocess(text) {
             text = snipTagContent('style', text);
             text = snipTagContent('script', text, '{}');
-            return svelte.parse(text);
+            return text;
         },
@@ -447,2 +551,9 @@ locStart,
 };
+const options = {
+    sveltePath: {
+        type: 'path',
+        description: 'Path to custom Svelte version to use',
+        default: 'svelte',
+    },
+};
 
@@ -452,2 +563,3 @@ exports.languages = languages;
 exports.printers = printers;
+exports.options = options;
 //# sourceMappingURL=plugin.js.map

README.md

@@ -11,2 +11,3 @@ # Prettier for Svelte components
     -   e.g. expressions inside of `{}`, event bindings `on:click=""`, and more
+-   Supports Svelte v2 and v3
 
@@ -13,0 +14,0 @@ ## How to use

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

62050

increased by22.84%

Lines of code

540

increased by24.71%

Number of lines in readme file

22

increased by4.76%

Worsened metrics

Dev dependency count

11

increased by22.22%

Number of low supply chain risk alerts

3

increased byInfinity%

Dependency changes

• + Addedsvelte@3.59.2(transitive)

• - Removedsvelte@2.16.0(transitive)

• Updatedsvelte@^2.0.0 || ^3.0.0-alpha