Merge pull request #1260 from vuejs/liquid

Fix #1259

Author: octref

client/grammar.ts

@@ -21,7 +21,8 @@ const SCOPES: { [lang: string]: string } = {
   yaml: 'source.yaml',
   json: 'source.json',
   php: 'source.php',
-  graphql: 'source.graphql'
+  graphql: 'source.graphql',
+  liquid: 'text.html.liquid'
 };
 
 export function getGeneratedGrammar(grammarPath: string, customBlocks: { [k: string]: string }): string {

docs/highlighting.md

@@ -9,6 +9,7 @@ Vetur supports syntax highlighting for the following languages:
 |`<template lang="jade">`|`pug`|
 |`<template lang="haml">`|`haml`|[Better Haml](https://marketplace.visualstudio.com/items?itemName=karunamurti.haml) or [Ruby Haml](https://marketplace.visualstudio.com/items?itemName=vayan.haml)|
 |`<template lang="slm">`|`slm`|[Slm Syntax](https://marketplace.visualstudio.com/items?itemName=mrmlnc.vscode-slm)|
+|`<template lang="liquid">`|`liquid`|[Liquid Language Support](https://github.com/GingerBear/vscode-liquid)|
 |`<style>`|`css`|
 |`<style lang="postcss">`|`postcss`|
 |`<style lang="scss">`|`scss`|

package.json

@@ -13,6 +13,7 @@
     "lint": "tslint -c tslint.json client/**/*.ts server/**/*.ts scripts/**/*.ts",
     "test:server": "npm run compile && cd server && npm test",
     "test:e2e": "node ./dist/test/codeTestRunner.js",
+    "test:grammar": "node ./dist/test/codeTestRunner.js grammar",
     "test:lsp": "node ./dist/test/codeTestRunner.js lsp",
     "test:int": "node ./dist/test/codeTestRunner.js interpolation",
     "test": "run-s lint compile test:server test:e2e",
@@ -115,6 +116,7 @@
           "text.jade.slm": "slm",
           "text.pug": "jade",
           "text.haml": "haml",
+          "text.html.liquid": "liquid",
           "source.css": "css",
           "source.css.scss": "scss",
           "source.css.less": "less",

syntaxes/vue-generated.json

@@ -290,6 +290,49 @@
         }
       ]
     },
+    {
+      "begin": "(<)(template)\\b(?=[^>]*lang=('liquid'|\"liquid\"))(?![^/>]*/>\\s*$)",
+      "beginCaptures": {
+        "1": {
+          "name": "punctuation.definition.tag.begin.html"
+        },
+        "2": {
+          "name": "entity.name.tag.template.html"
+        }
+      },
+      "end": "(</)(template)(>)",
+      "endCaptures": {
+        "1": {
+          "name": "punctuation.definition.tag.begin.html"
+        },
+        "2": {
+          "name": "entity.name.tag.template.html"
+        },
+        "3": {
+          "name": "punctuation.definition.tag.end.html"
+        }
+      },
+      "patterns": [
+        {
+          "include": "#tag-stuff"
+        },
+        {
+          "contentName": "text.html.liquid",
+          "begin": "(>)",
+          "beginCaptures": {
+            "1": {
+              "name": "punctuation.definition.tag.end.html"
+            }
+          },
+          "end": "(?=</template>)",
+          "patterns": [
+            {
+              "include": "text.html.liquid"
+            }
+          ]
+        }
+      ]
+    },
     {
       "begin": "(<)(template)(?![^/>]*/>\\s*$)",
       "beginCaptures": {

syntaxes/vue.tmLanguage.json

@@ -204,6 +204,49 @@
         }
       ]
     },
+    {
+      "begin": "(<)(template)\\b(?=[^>]*lang=('liquid'|\"liquid\"))(?![^/>]*/>\\s*$)",
+      "beginCaptures": {
+        "1": {
+          "name": "punctuation.definition.tag.begin.html"
+        },
+        "2": {
+          "name": "entity.name.tag.template.html"
+        }
+      },
+      "end": "(</)(template)(>)",
+      "endCaptures": {
+        "1": {
+          "name": "punctuation.definition.tag.begin.html"
+        },
+        "2": {
+          "name": "entity.name.tag.template.html"
+        },
+        "3": {
+          "name": "punctuation.definition.tag.end.html"
+        }
+      },
+      "patterns": [
+        {
+          "include": "#tag-stuff"
+        },
+        {
+          "contentName": "text.html.liquid",
+          "begin": "(>)",
+          "beginCaptures": {
+            "1": {
+              "name": "punctuation.definition.tag.end.html"
+            }
+          },
+          "end": "(?=</template>)",
+          "patterns": [
+            {
+              "include": "text.html.liquid"
+            }
+          ]
+        }
+      ]
+    },
     {
       "begin": "(<)(template)(?![^/>]*/>\\s*$)",
       "beginCaptures": {

syntaxes/vue.yaml

@@ -101,6 +101,26 @@ patterns:
         patterns:
           - include: text.jade.slm
 
+  # liquid
+  - begin: (<)(template)\b(?=[^>]*lang=('liquid'|"liquid"))(?![^/>]*/>\s*$)
+    beginCaptures:
+      '1': { name: punctuation.definition.tag.begin.html }
+      '2': { name: entity.name.tag.template.html }
+    end: (</)(template)(>)
+    endCaptures:
+      '1': { name: punctuation.definition.tag.begin.html }
+      '2': { name: entity.name.tag.template.html }
+      '3': { name: punctuation.definition.tag.end.html }
+    patterns:
+      - include: '#tag-stuff'
+      - contentName: text.html.liquid
+        begin: (>)
+        beginCaptures:
+          '1': { name: punctuation.definition.tag.end.html }
+        end: (?=</template>)
+        patterns:
+          - include: text.html.liquid
+
   # html
   - begin: (<)(template)(?![^/>]*/>\s*$)
     beginCaptures: