create-linkdesk-plugin 0.1.8 → 0.1.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-linkdesk-plugin",
-  "version": "0.1.8",
+  "version": "0.1.10",
   "description": "LinkDesk 插件脚手架——`npm create linkdesk-plugin@latest my-cool-plugin` 一行生成你的第一个插件项目（对标 yo code）。",
   "type": "module",
   "bin": {

package/template/plugin.json

@@ -11,6 +11,8 @@
   // ── 插件身份 ──
   // 🔴 插件 ID：**显式声明**。它是安装目录名 / 卸载墓碑 / 更新对账的唯一键，**发布后永不可变**。
   // 它与插件所在的目录名**无关**（目录可以随便改）——所以别拿目录名当它的替身。
+  // ⚠️ 且**不得以 `ldk-` 开头**：`ldk-` 是宿主与共享组件的命名空间，而你在 index.css 里的
+  //    类名前缀正是由它派生（`<pluginId>-你的类名`）——以 `ldk-` 开头 = 把自己的名字落进宿主空间。
   "pluginId": "{{pluginName}}",
   "name": "{{displayName}}", // 显示名——标签页 / 插件详情等 UI 出现处
   "version": "0.1.0", // 语义化版本 x.y.z——市场更新比较靠它；+1 时务必同笔补 CHANGELOG.md 的新段

package/template/scripts/ci-verify.mjs

@@ -127,29 +127,38 @@ if (report) process.stdout.write(renderPluginLintReport(report) + "\n");
  * 但必须响亮打印——静默放过才是真问题。
  */
 const RULE_NOT_FOUND_RE = /^Definition for rule '.*' was not found/;
-/** 按腿取偏离数（label 与 lint.ts 的 legs 一致） */
-const legCount = (label) => report?.legs.find((l) => l.label === label)?.violations.length ?? 0;
 
 const allRows = report?.eslintRows ?? [];
 const ruleNotFound = allRows.filter((r) => RULE_NOT_FOUND_RE.test(r.message));
 const strictEslintRows = allRows.filter((r) => !RULE_NOT_FOUND_RE.test(r.message));
-/** 判红的三样：真 eslint 偏离 + css 硬编码腿（硬约束 1 的 .css 半边，eslint 到不了 .css）+ 见下 ②③④⑤ */
-const cssLegViolations = legCount("check-css-hardcode");
-const strictLintViolations = strictEslintRows.length + cssLegViolations;
-/** 只报告不拦的两条腿：字号度量与 4px 节奏——属「审美校准」，存量偏离多且修它们要动插件源码 */
-const advisoryLintViolations = legCount("check-font-scale") + legCount("check-spacing-grid");
+/**
+ * 判红的两样：真 eslint 偏离 + check 腿偏离（见下 ②③④⑤）。
+ * 🔴 **严格腿 = 除「报表档」外的全部腿**（fail-closed）：SDK 新增一条腿（如 check-css-namespace）
+ *    自动进严格档——想放宽必须把腿名写进 ADVISORY_LEGS 并说明理由，不许默默不查。
+ */
+const ADVISORY_LEGS = new Set(["check-font-scale", "check-spacing-grid"]);
+const reportLegs = report?.legs ?? [];
+const strictLegs = reportLegs.filter((l) => !ADVISORY_LEGS.has(l.label));
+const strictLegViolations = strictLegs.reduce((sum, l) => sum + l.violations.length, 0);
+const strictLintViolations = strictEslintRows.length + strictLegViolations;
+/** 报表档：字号度量与 4px 节奏——属「审美校准」，存量偏离多且修它们要动插件源码 */
+const advisoryLintViolations = reportLegs
+  .filter((l) => ADVISORY_LEGS.has(l.label))
+  .reduce((sum, l) => sum + l.violations.length, 0);
 
 if (lintNoObject) {
   line(`⏭ ① lint 严格腿：${lintNoObject}——本仓**无对象**（不是「绿」，是「没有可查的东西」）。`);
 } else if (strictLintViolations > 0) {
   fail(
-    `① lint 严格腿：${strictLintViolations} 处偏离（eslint ${strictEslintRows.length} + css 硬编码腿 ${cssLegViolations}）` +
-      `——SDK 的 \`npm run lint\` 只报告不拦，**CI 拦**。逐条见上方报告。`,
+    `① lint 严格腿：${strictLintViolations} 处偏离（eslint ${strictEslintRows.length} + ` +
+      strictLegs.map((l) => `${l.label} ${l.violations.length}`).join(" + ") +
+      `）——SDK 的 \`npm run lint\` 只报告不拦，**CI 拦**。逐条见上方报告。`,
   );
 } else {
   line(
-    `✅ ① lint 严格腿：eslint 规则腿 ${report.files} 文件 + css 硬编码腿 零偏离` +
-      `（本段判红的是「硬约束 1/2 那一档」）。`,
+    `✅ ① lint 严格腿：eslint 规则腿 ${report.files} 文件 + ` +
+      strictLegs.map((l) => `${l.label} 零偏离`).join(" + ") +
+      `（本段判红的是「硬约束」那一档）。`,
   );
 }
 if (ruleNotFound.length > 0) {
@@ -161,9 +170,12 @@ if (ruleNotFound.length > 0) {
 }
 if (advisoryLintViolations > 0) {
   line(
-    `   ⚠ 附加腿（**报告不拦**）：font-scale ${legCount("check-font-scale")} 处 / ` +
-      `spacing-grid ${legCount("check-spacing-grid")} 处——字号度量与 4px 节奏属审美校准档` +
-      `，逐条见上方报告；确属有意的用标准 disable 注释写明理由。`,
+    `   ⚠ 附加腿（**报告不拦**）：` +
+      reportLegs
+        .filter((l) => ADVISORY_LEGS.has(l.label))
+        .map((l) => `${l.label.replace("check-", "")} ${l.violations.length} 处`)
+        .join(" / ") +
+      `——字号度量与 4px 节奏属审美校准档，逐条见上方报告；确属有意的用标准 disable 注释写明理由。`,
   );
 }
 

package/template/src/index.css

@@ -1,30 +1,33 @@
-/* {{displayName}} 样式示例（`npm run lint` 会照着下面三条查）。
-   三条纪律：
-   · 颜色一律 var(--xxx)，禁硬编码 hex——用户换主题时你的插件要跟着变；
-   · 字号一律 var(--font-size-*)——用户调全局字号时它才跟着缩放，裸 px 不会；
-   · padding / margin / gap 走 4px 节奏（4 的倍数）。 */
-
-.starter {
-  padding: 24px;
-  font-family: inherit;
-}
-
-.starter__title {
-  margin: 0 0 8px;
-  color: var(--text);
-}
-
-.starter__text {
-  margin: 0 0 4px;
-  color: var(--text-muted);
-}
-
-.starter__hint {
-  margin: 0;
-  color: var(--text-muted);
-  font-size: var(--font-size-xs);
-}
-
-.starter__hint code {
-  font-family: var(--font-mono, monospace);
-}
+/* {{displayName}} 样式示例（`npm run lint` 会照着下面四条查）。
+   四条纪律：
+   · 颜色一律 var(--xxx)，禁硬编码 hex——用户换主题时你的插件要跟着变；
+   · 字号一律 var(--font-size-*)——用户调全局字号时它才跟着缩放，裸 px 不会；
+   · padding / margin / gap 走 4px 节奏（4 的倍数）；
+   · 类名一律以 {{pluginName}}- 开头——插件视图里宿主、共享组件与**所有已加载插件**的
+     CSS 在同一张样式表里，裸类名（如 .starter）是全局标识符，会和别人的同名规则
+     互相覆盖（不报错、只是长得不对）。 */
+
+.{{pluginName}}-starter {
+  padding: 24px;
+  font-family: inherit;
+}
+
+.{{pluginName}}-starter__title {
+  margin: 0 0 8px;
+  color: var(--text);
+}
+
+.{{pluginName}}-starter__text {
+  margin: 0 0 4px;
+  color: var(--text-muted);
+}
+
+.{{pluginName}}-starter__hint {
+  margin: 0;
+  color: var(--text-muted);
+  font-size: var(--font-size-xs);
+}
+
+.{{pluginName}}-starter__hint code {
+  font-family: var(--font-mono, monospace);
+}

package/template/src/index.tsx

@@ -1,35 +1,35 @@
-/**
- * {{displayName}}——LinkDesk 插件主视图（由 create-linkdesk-plugin 生成）。
- *
- * 视图插件契约（作者文档 01-plugin-api-contract.md）：壳以 { isActive, tabId?, sourceId? }
- * 渲染本文件 default 导出的组件：
- *   - isActive  本标签当前是否聚焦。keep-alive 下非聚焦标签仍在渲染，isActive 只用于
- *               gate「聚焦才跑」的副作用（如自动保存），切勿用它整块 blank 掉内容。
- *   - tabId     本标签页 id。
- *   - sourceId  上下文数据（文件路径 / 数据源等），编辑器类插件用它定位内容。
- *
- * 样式：LinkDesk 主题色一律走 CSS 变量 var(--xxx)（见 index.css 示例），禁硬编码 hex。
- * 文案：用 t() 读——key 就是中文原文，英文译文放 i18n/en.json（见作者文档 05-ui-conventions.md）。
- * 壳已 external react/react-dom/react-i18next/i18next——构建不会打进包，插件工程无需 npm i 它们。
- */
-
-import { useTranslation } from "react-i18next";
-import "./index.css";
-
-export default function HelloPlugin(_props: { isActive?: boolean; tabId?: string; sourceId?: string }) {
-  const { t } = useTranslation();
-
-  return (
-    <div className="starter">
-      <h2 className="starter__title">{t("插件跑起来了 ✨")}</h2>
-      <p className="starter__text">{t("这是你的第一个 LinkDesk 插件。")}</p>
-      <p className="starter__hint">
-        <code>src/index.tsx</code> {t("是插件本体——改它，浏览器预览即时刷新。")}
-      </p>
-      <p className="starter__hint">
-        <code>npm run build</code> {t("打包出分发文件，可装进 LinkDesk 或发布到市场。")}
-      </p>
-      <p className="starter__hint">{t("目录该放哪、发布怎么做，都写在 README.md 里。")}</p>
-    </div>
-  );
-}
+/**
+ * {{displayName}}——LinkDesk 插件主视图（由 create-linkdesk-plugin 生成）。
+ *
+ * 视图插件契约（作者文档 01-plugin-api-contract.md）：壳以 { isActive, tabId?, sourceId? }
+ * 渲染本文件 default 导出的组件：
+ *   - isActive  本标签当前是否聚焦。keep-alive 下非聚焦标签仍在渲染，isActive 只用于
+ *               gate「聚焦才跑」的副作用（如自动保存），切勿用它整块 blank 掉内容。
+ *   - tabId     本标签页 id。
+ *   - sourceId  上下文数据（文件路径 / 数据源等），编辑器类插件用它定位内容。
+ *
+ * 样式：LinkDesk 主题色一律走 CSS 变量 var(--xxx)（见 index.css 示例），禁硬编码 hex。
+ * 文案：用 t() 读——key 就是中文原文，英文译文放 i18n/en.json（见作者文档 05-ui-conventions.md）。
+ * 壳已 external react/react-dom/react-i18next/i18next——构建不会打进包，插件工程无需 npm i 它们。
+ */
+
+import { useTranslation } from "react-i18next";
+import "./index.css";
+
+export default function HelloPlugin(_props: { isActive?: boolean; tabId?: string; sourceId?: string }) {
+  const { t } = useTranslation();
+
+  return (
+    <div className="{{pluginName}}-starter">
+      <h2 className="{{pluginName}}-starter__title">{t("插件跑起来了 ✨")}</h2>
+      <p className="{{pluginName}}-starter__text">{t("这是你的第一个 LinkDesk 插件。")}</p>
+      <p className="{{pluginName}}-starter__hint">
+        <code>src/index.tsx</code> {t("是插件本体——改它，浏览器预览即时刷新。")}
+      </p>
+      <p className="{{pluginName}}-starter__hint">
+        <code>npm run build</code> {t("打包出分发文件，可装进 LinkDesk 或发布到市场。")}
+      </p>
+      <p className="{{pluginName}}-starter__hint">{t("目录该放哪、发布怎么做，都写在 README.md 里。")}</p>
+    </div>
+  );
+}