@basenative /验证
BaseNative模板的结构化验证。每一个诊断都被设计成 可由模型单独从错误对象修复,无需访问文档。
import { validateTemplate } from '@basenative/validate';
validateTemplate('<div v-if="isAdmin">…</div>');
// {
// valid: false,
// diagnostics: [{
// code: 'BN_E_FOREIGN_DIRECTIVE',
// severity: 'error',
// message: '"v-if" is Vue syntax; BaseNative does not support it — BaseNative puts
// conditionals on a <template>, not on the element itself',
// suggestion: '<template @if="isAdmin">',
// span: { line: 1, col: 6 },
// confidence: 'high'
// }]
// }
通过一项 context 也可以查看参考资料:
validateTemplate('<p>{{ itmes }}</p>', { context: { items: [] } });
// → BN_E_UNBOUND_REF, suggestion: 'Did you mean "items"? …'
为什么存在这个
BaseNative的语法是四个生态系统的混合体: {{ }} 从Vue /角,
@for="item of items; track item.id" 几乎和Angular 17一字不差, :disabled
从Vue, signal()/computed()/effect() 从固体。这种熟悉使
非常 可读的 -并使失效模式 自信回归
最近的邻居. 负载下的模型发出 v-if,或者Angular的块形式,或者
$state,而不是发明一些新奇的东西。
阅读不是写作。这个包衡量了差异。
诊断代码
| 代码 | 严重程度 | 捕获 |
|---|---|---|
BN_E_FOREIGN_DIRECTIVE | 错误 | Vue / Angular / Svelte / Alpine语法,以及等效的BaseNative |
BN_E_CONTROL_FLOW_ON_ELEMENT | 错误 | @if/@for/@switch 在一个非——<template> 元素 |
BN_E_UNKNOWN_DIRECTIVE | 错误 | 一个 @-directive BaseNative没有定义 |
BN_E_EXPR_UNSUPPORTED | 错误 | 表达式在csp安全子集之外,或阻塞原型访问 |
BN_E_MALFORMED_FOR | 错误/警告 | @for 不匹配 item of items;失踪 track 警告 |
BN_E_ORPHAN_BRANCH | 错误 | @else/@empty/@case/@default 没有管理指令 |
BN_E_UNBOUND_REF | 警告 | 所提供上下文中缺少的引用 |
BN_E_CONTROL_FLOW_ON_ELEMENT 是最重要的吗
在一个 <template>, @if 是控制流。在任何其他元素上, 每一个 @name
属性注册为事件侦听器。所以 <div @if="admin"> 默默地
结合一个 "if" 事件,并且永远不会有条件地呈现-在
所有人。这是语言中一个完全看不见的错误
静态验证。
严重的合同
valid 是 false 只有当至少一个 error-严重性诊断存在。
验证器永远不会将运行时接受的内容报告为错误。 @for
没有 track 呈现罚款(它丧失了键控和解),所以它宁可发出警告
它失败了——一个验证器不同意它所验证的东西是比它更糟糕的
没有验证器。
设计说明
表达式检查导入 compileExpression 从
@basenative/runtime/shared/expression - - - 与求值器使用的解析器相同.
第二个独立的表达式解析器将偏离运行时,即
这正是这个包存在的目的。
标记扫描器故意不是DOM解析器:DOM解析器丢弃字节 偏移、规范化大小写,并静默地修复错误的标记 这正是我们要抱怨的。
许可证
apache - 2.0