Skip to content

Commit 0ae8dbb

Browse files
panoplynightwing
andauthored
fix: Improves Liquid Support (#5098)
* Improve liquid grammar support Brings support for Shopify Liquid Variation embedded code blocks which include: - {% schema %} - {% javascript %} - {% style %} - {% stylesheet %} In addition, line comment highlighting is now provided. * Include the additional modes * add additional context and syntax samples * purge the mode test file (not really relevant anymore) * align behaviour for delimiter matches * fix lookbehind expressions * restore test for liquid mode --------- Co-authored-by: nightwing <[email protected]>
1 parent 38a1844 commit 0ae8dbb

File tree

6 files changed

+755
-284
lines changed

6 files changed

+755
-284
lines changed

demo/kitchen-sink/docs/liquid.liquid

+54-3
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
1-
The following examples can be found in full at http://liquidmarkup.org/
1+
There are a couple of different Liquid variations in circulation. This grammars supports
2+
both the Standard and Shopify Liquid variations. The following examples can be found in full at:
3+
4+
Standard Variation: https://shopify.github.io/liquid
5+
Shopify Variation: https://shopify.dev/docs/api/liquid
26

37
Liquid is an extraction from the e-commerce system Shopify.
48
Shopify powers many thousands of e-commerce stores which all call for unique designs.
@@ -37,11 +41,18 @@ Some more features include:
3741

3842
<h2>If</h2>
3943
<p>
40-
{% if user.name == 'tobi' or user.name == 'marc' %}
44+
{% if user.name == 'tobi' or user.name == 'marc' %}
4145
hi marc or tobi
4246
{% endif %}
4347
</p>
4448

49+
<h2>Comments</h2>
50+
51+
{% # Line Comment %}
52+
53+
{% comment %}
54+
Block Comment
55+
{% endcomment %}
4556

4657
<h2>Case</h2>
4758
<p>
@@ -58,7 +69,7 @@ Some more features include:
5869

5970
<h2>For Loops</h2>
6071
<p>
61-
{% for item in array %}
72+
{% for item in array %}
6273
{{ item }}
6374
{% endfor %}
6475
</p>
@@ -74,3 +85,43 @@ Some more features include:
7485
{% endif %}
7586
{% endtablerow %}
7687
</p>
88+
89+
<h2>Embedded Code Blocks</h2>
90+
91+
This support Shopify Liquid variation JSON schema code blocks
92+
93+
{% schema %}
94+
{
95+
"string": "bar",
96+
"boolean": true,
97+
"number": 100,
98+
"object": {
99+
"array": [100, false, "string", {}, [] ]
100+
}
101+
}
102+
{% endschema %}
103+
104+
This support Shopify Liquid variation Stylesheet and Style code blocks
105+
106+
{% style %}
107+
.class {
108+
font-size: 10px; /* comment */
109+
}
110+
{% endstyle %}
111+
112+
{% stylesheet %}
113+
.class {
114+
font-size: 10px; /* comment */
115+
}
116+
{% endstylesheet %}
117+
118+
This support Shopify Liquid variation JavaScript code blocks
119+
120+
{% javascript %}
121+
122+
function foo (param) {
123+
124+
return 'something' // comment
125+
}
126+
127+
{% endjavascript %}

src/mode/_test/highlight_rules_test.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ if (!fs.existsSync)
1313
require("amd-loader");
1414

1515
var cwd = __dirname + "/";
16-
var root = path.normalize(cwd + Array(5).join("../"));
16+
var root = path.normalize(cwd + Array(4).join("../"));
1717

1818
function jsFileList(path, filter) {
1919
if (!filter) filter = /_test/;

0 commit comments

Comments
 (0)