GritQL 插件配方

`$left == $right` where {
    $right <: not `null`,
    $left <: not `null`,
    register_diagnostic(
        span = $left,
        message = "Use `===` instead of `==`. Loose equality is only acceptable when comparing against `null`.",
        severity = "warn"
    )
}

`$collection.forEach($...)` as $call where {
    register_diagnostic(
        span = $call,
        message = "Prefer `for...of` over `.forEach()`. It supports `break`, `continue`, and `await`."
    )
}

const items = [1, 2, 3];
items.forEach((item) => console.log(item));
items.forEach((item, index) => {
  console.log(index, item);
});
for (const item of items) {
  console.log(item);
}

`import $_ from $source` where {
    $source <: or { `'lodash'`, `'underscore'`, `'moment'` },
    register_diagnostic(
        span = $source,
        message = "This package is not allowed. Use the approved alternative instead."
    )
}

or {
    `import $_ from $source`,
    `require($source)`
} where {
    $source <: or { `'lodash'`, `'underscore'`, `'moment'` },
    register_diagnostic(
        span = $source,
        message = "This package is not allowed. Use the approved alternative instead."
    )
}

const moment = require("moment");
const utils = require("lodash");

`new Date($first, $...)` as $expr where {
    register_diagnostic(
        span = $expr,
        message = "Avoid the `Date` constructor for parsing. Use the project's date utility instead."
    )
}

const now = new Date();
const parsed = new Date("2024-01-15");
const custom = new Date(2024, 0, 15);
const fromTs = new Date(1705276800000);

or {
    `eval($code)` as $match,
    `new Function($...)` as $match
} where {
    register_diagnostic(
        span = $match,
        message = "Dynamic code evaluation is not allowed. Avoid `eval()` and `new Function()`."
    )
}

eval("alert(1)");
const fn = new Function("a", "b", "return a + b");
const safe = JSON.parse(data);

engine biome(1.0)
language js(typescript, jsx)

JsConditionalExpression() as $outer where {
    $outer <: contains JsConditionalExpression() as $inner,
    register_diagnostic(
        span = $inner,
        message = "Nested ternary expressions are not allowed. Use `if`/`else` instead."
    )
}

const a = x ? 1 : 0;
const b = x ? (y ? 1 : 2) : 0;
const c = x ? 1 : y ? 2 : 3;

engine biome(1.0)
language js(typescript, jsx)

JsParameters() as $params where {
    $params <: r".*,.*,.*,.*",
    register_diagnostic(
        span = $params,
        message = "Functions should not have more than 3 parameters. Use an options object instead.",
        severity = "warn"
    )
}

function ok(a, b, c) {}
function tooMany(a, b, c, d) {}
const arrow = (a, b, c, d, e) => {};

engine biome(1.0)
language js(typescript, jsx)

JsCatchClause(body = JsBlockStatement(statements = [])) as $catch where {
    register_diagnostic(
        span = $catch,
        message = "Empty catch blocks are not allowed. Handle the error or add a comment explaining why it is ignored."
    )
}

try {
  riskyOperation();
} catch (e) {}

try {
  anotherOp();
} catch (e) {
  console.error(e);
}

engine biome(1.0)
language js(typescript)

TsAnyType() as $any where {
    register_diagnostic(
        span = $any,
        message = "Don't use `any`. Use `unknown`, a specific type, or a generic instead.",
        severity = "warn"
    )
}

let x: any = 1;
function foo(x: any): any {
  return x;
}
const arr: Array<any> = [];
let safe: unknown = 1;

engine biome(1.0)
language js(typescript, jsx)

JsVariableStatement() as $stmt where {
    $stmt <: r"let.*",
    register_diagnostic(
        span = $stmt,
        message = "Prefer `const` unless the variable is reassigned.",
        severity = "hint"
    )
}

let x = 1;
let y = "hello";
const z = true;

`dangerouslySetInnerHTML=$value` as $attr where {
    register_diagnostic(
        span = $attr,
        message = "Do not use `dangerouslySetInnerHTML`. Sanitize content and render it safely instead."
    )
}

`style=$value` as $attr where {
    register_diagnostic(
        span = $attr,
        message = "Avoid inline `style` props. Use a CSS class or a styled component instead.",
        severity = "warn"
    )
}

engine biome(1.0)
language css

CssDeclarationWithSemicolon() as $decl where {
    $decl <: contains CssDeclarationImportant(),
    register_diagnostic(
        span = $decl,
        message = "Avoid `!important`. Increase selector specificity or restructure your styles instead."
    )
}

.button {
  color: red !important;
  display: flex;
}
.override {
  margin: 0 !important;
}

language css;

`color: $value` as $decl where {
    $value <: r"#[0-9a-fA-F]+",
    register_diagnostic(
        span = $value,
        message = "Don't use hardcoded hex colors. Use a CSS custom property (e.g. `var(--color-primary)`) instead.",
        severity = "warn"
    )
}

.header {
  color: #ff0000;
  background: var(--bg-primary);
}
.text {
  color: #1a2b3c;
}

.header {
  color: #ff0000;
  background: var(--bg-primary);
}
.alert {
  color: rgb(255, 0, 0);
}
.text {
  color: hsl(200, 50%, 50%);
}
.safe {
  color: var(--text-primary);
}

language css;

or {
    `float: $value`,
    `clear: $value`
} as $decl where {
    register_diagnostic(
        span = $decl,
        message = "The `float` and `clear` properties are not allowed. Use Flexbox or Grid for layout."
    )
}

.sidebar {
  float: left;
  width: 200px;
}
.clearfix {
  clear: both;
}
.modern {
  display: grid;
}

engine biome(1.0)
language json

JsonMemberName() as $name where {
    $name <: or { r".*_.*", r".[A-Z].*" },
    register_diagnostic(
        span = $name,
        message = "JSON keys must use camelCase.",
        severity = "warn"
    )
}

{
  "userName": "alice",
  "user_name": "bob",
  "UserAge": 30,
  "email": "a@b.com"
}

or {
    `debugger` as $match where {
        register_diagnostic(
            span = $match,
            message = "Remove `debugger` statements before committing."
        )
    },
    `alert($...)` as $match where {
        register_diagnostic(
            span = $match,
            message = "Remove `alert()` calls before committing."
        )
    },
    `console.$method($...)` as $match where {
        $method <: or { `log`, `debug`, `trace` },
        register_diagnostic(
            span = $match,
            message = "Remove debug logging before committing.",
            severity = "warn"
        )
    }
}

debugger;
alert("test");
console.log("debug info");
console.error("real error");
console.debug("trace");

engine biome(1.0)
language js(typescript, jsx)