diff --git a/website/public/blog/version-3.0/index.ejs.html b/website/public/blog/version-3.0/index.ejs.html new file mode 100644 index 0000000000..db018c833c --- /dev/null +++ b/website/public/blog/version-3.0/index.ejs.html @@ -0,0 +1,250 @@ + + + + + + + + <%- await include("../../common-head.ejs.html") %> <%- await + include("../blog-head.ejs.html") %> + + + + <% function callsToAction() { %> + + <% } %> + +
<%- await include("../../common-nav.ejs.html") %>
+ +
+

<%= meta.title %>

+

+ + @@@ + + <%- callsToAction() %> + + +

How does quick-lint-js compare to ESLint? See for yourself:

+ + + + + +
+
+
TypeScript
+
+ 
const trimArg = <T>(fn: (a: T) => boolean) => {
+  return (arg1: any, arg2: T) => {
+    return fn(arg2);
+  };
+};
+

+ Cannot find name 'T'. (2304)
+ JSX element 'T' has no corresponding closing tag. (17008)
+ Unexpected token. Did you mean `{'>'}` or `&gt;`? (1382)
+ Unexpected token. Did you mean `{'>'}` or `&gt;`? (1382)
+ Expression expected. (1109)
+ Unexpected token. Did you mean `{'>'}` or `&gt;`? (1382)
+ Expression expected. (1109)
+ Unexpected token. Did you mean `{'}'}` or `&rbrace;`? (1381)
+ Unexpected token. Did you mean `{'}'}` or `&rbrace;`? (1381)
+ '</' expected. (1005)

+
+
+
+
quick-lint-js
+
+ 
const trimArg = <T>(fn: (a: T) => boolean) => {
+  return (arg1: any, arg2: T) => {
+    return fn(arg2);
+  };
+};
+

+ generic arrow function needs ',' here in TSX [E0285] +

+
+
+
+ + +
+
+
TypeScript
+
+ 
export function Spacer() {
+  return
+    <EuiSpacer size="xs" />
+    <EuiHorizontalRule margin="none" />
+    <EuiSpacer size="xs" />
+}
+

Unreachable code detected. (7027)
+JSX expressions must have one parent element. (2657)

+
+
+
+
quick-lint-js
+
+ 
export function Spacer() {
+  return
+    <EuiSpacer size="xs" />
+    <EuiHorizontalRule margin="none" />
+    <EuiSpacer size="xs" />
+}
+

+ return statement returns nothing (undefined) [E0179]
+missing '<>' and '</>' to enclose multiple children [E0189] +

+
+
+
+ + +
+
+
TypeScript
+
+ 
it('matches on the first word', await () => {
+  await table.searchForItemWithName('Hello');
+  await table.expectItemsCount('visualize', 1);
+});
+

+ Expression expected. (1109)
+ ',' expected. (1005)
+ ':' expected. (1005)
+ ',' expected. (1005)
+ ':' expected. (1005)
+ ',' expected. (1005) +

+
+
+
+
quick-lint-js
+
+ 
it('matches on the first word', await () => {
+  await table.searchForItemWithName('Hello');
+  await table.expectItemsCount('visualize', 1);
+});
+

+ 'await' cannot be followed by an arrow function; use 'async' + instead [E0178] +

+
+
+
+ + + + + +
+
+
ESLint
+
+ 
function TodoEntry({title, children}) {
+  return (
+    <h3>{title}</h3>
+    <div className="body">{children}</div>
+  );
+}
+

Adjacent JSX elements must be wrapped in an enclosing tag

+
+
+
+
quick-lint-js
+
+ 
function TodoEntry({title, children}) {
+  return (
+    <h3>{title}</h3>
+    <div className="body">{children}</div>
+  );
+}
+

+ missing '<>' and '</>' to enclose multiple + children;
children end here [E0189] +

+
+
+
+ + +

+ What should we work on next? + Suggest features for quick-lint-js. +

+ +

+ quick-lint-js version 3.0 has over @@@ patches since version 2.0. + @@@ people + made quick-lint-js possible. +

+ + <%- callsToAction() %> + +

+ Written by strager, lead + developer of quick-lint-js. +

+ + +
+ + + + diff --git a/website/public/main.css b/website/public/main.css index bbd640b303..f808fed96a 100755 --- a/website/public/main.css +++ b/website/public/main.css @@ -392,11 +392,18 @@ pre mark, text-decoration-skip-ink: none; text-decoration-style: wavy; } +pre mark:empty { + background: none; + display: inline-block; + height: 1em; + margin-left: -2px; /* (width of SVG) / 2 */ + position: absolute; + width: 6px; +} pre mark:empty::before { color: red; content: url("demo/carat.svg") / "^"; content: url("demo/carat.svg"); - margin-left: -2px; /* (width of SVG) / 2 */ margin-top: 4px; /* height of SVG */ position: absolute; }