v4 → v5 への移行

v5 は土台から書き直されました: すべての page を server-render し、各 page に対して companion の .md を emit し、built-in の search と source viewer を ship し、 opts.docs の prose pipeline を追加します。configuration の表面はかなり変わりまし た — ですが移行は機械的で、この page(と下記の migration skill)が手順を案内します。

この作業はまるごと AI assistant に任せられます。 専用の migration skill があります — agent をこれに向ければ、 あなたの options を持ち上げ、引き継がれるものを rename し、なくなったものを削除し、 build を verify します。下の エージェントに任せる を 参照してください。

知っておくべき唯一のこと

v4 は theme options を opts.theme_opts.* の下に nest していました。v5 はそれ らを opts.* から直接 読み取ります — v5 に theme_opts block はありません。 つまり移行とは、要するに次のことです: options を theme_opts から外へ持ち上げ、 引き継がれる少数を rename し、残りを削除し、そして必要に応じて v5 の新機能を 取り入れる。

CODE
// v4 — opts.theme_opts の下に nest
{ opts: { template: "node_modules/clean-jsdoc-theme",
          theme_opts: { default_theme: "dark", title: "My Library" } } }

// v5 — opts の直下(theme_opts なし)
{ opts: { template: "node_modules/clean-jsdoc-theme",
          siteName: "My Library" } }

手順

  1. 1
    Check compatibility

    v5 には JSDoc ≥ 4Node ≥ 20 が必要です。plugins/markdown plugin は theme にとってもう必須ではありません(v5 は Markdown を自前で render します)が、 残しておいても無害です。当面は v4 にとどまりたいですか? "clean-jsdoc-theme": "^4" で pin してください — v5 prereleases は npm の next tag の下に publish されるため、 ^4 はそれらを引き込みません。

  2. 2
    Upgrade the package
    CODE
    npm i -D clean-jsdoc-theme@latest   # または v5 prerelease 中は @next
  3. 3
    Lift and rename options

    すべての key を theme_opts から外へ出して opts まで持ち上げ、 mapping table を適用し、それから空の theme_opts block を削除 します。引き継がれる options は次のとおりです(それ以外はすべて削除されます):

    • base_urlbasePath
    • titlesiteName
    • sectionssectionOrder
    • create_stylecustomCssinclude_css / add_style_pathcustomCssFile
    • add_scriptscustomJsinclude_js / add_script_pathcustomJsFile
    • menumenu(再構成 — 下記参照)
  4. 4
    Build and verify
    CODE
    npx jsdoc -c jsdoc.json
    npx serve <destination>   # Pagefind の full-text search には HTTP が必要

    v5 は、残っている theme_opts key や v4 の option 名に対して 警告 を出し (「もしかして?」のヒント付き)、build を続行します — 出力を読み、指摘されたものを 修正してください。移行中はそれらの警告を厳格な errors に変えるために strict: true を設定し、終わったら緩めてください。

Option mapping

opts.theme_opts.<v4>opts.<v5>

v4 (theme_opts.*)v5 (opts.*)状態注記
default_theme削除Light/dark token sets + runtime toggle; picker なし。
base_urlbasePathrenamedlinks に prefix される site root。
titlesiteName変更String または logo set { default, dark, light, alt }
menumenu変更再構成: { id?, title?, link/href?, icon?, target?, class? }iconid built-ins を追加。
sectionssectionOrderrenamedsidebar sections を filter + order。
create_stylecustomCssrenamedInline CSS(theme stylesheet の後に load)。
include_css / add_style_pathcustomCssFilerenamed/変更CSS file → content-hashed asset link。
add_scriptscustomJsrenamedInline JS(最後に実行)。
include_js / add_script_pathcustomJsFilerenamed/変更JS file → content-hashed asset。
homepageTitle削除Home <title> は README / docs/index.md + siteName から derive。
includeFilesListInHomepage削除Source Files section が files を列挙。
metameta変更再び supported — attribute maps の array → <head><meta> tags。meta を参照。
search削除常時 on の fuzzy search + 省略可能な Pagefind。
codepenplayground変更v4 は @example から CodePen を事前入力しました; v5 はそれを playground に一般化します — opts.playground + @playground tag を介して、example を CodePen、JSFiddle、CodeSandbox で開けます。(既存の pen を URL で embed するには @iframe を使用。)
static_dir削除JSDoc 自身の static-file config を使用。
footerfooter変更再び supported — inline HTML string または { file: "./footer.html" }customCss / customCssFile で style します。footer を参照。
exclude_inherited, displayModuleHeader, sort, shouldRemoveScrollbarStyle削除相当なし。

menu が再構成されました: v4 の entry { title, link, target, class, id } は v5 の { id?, title?, link (or href)?, icon?, target?, class? } になります — iconlucide:<name> / simpleicons:<name>)を追加できます。v5 では、 id は built-ins も選択し({ id: "home" }{ id: "source" })、menusectionOrder より優先されます。menuStructure your sidebar を参照してください。

移行前 / 移行後

CODE
{
  plugins: ["plugins/markdown"],
  opts: {
    template: "./node_modules/clean-jsdoc-theme",
    theme_opts: {
      default_theme: "dark",
      base_url: "https://example.com/docs/",
      title: "My Library",
      menu: [{ title: "GitHub", link: "https://github.com/me/lib", target: "_blank" }],
      sections: ["Classes", "Modules", "Global"],
      search: true,
      footer: "© My Library",
      include_css: ["./static/custom.css"],
    },
  },
}

v5 で解放されるもの

移行は upgrade でもあります。v5 に移ったら、次に手を伸ばしてください:

エージェントに任せる

手作業でやりたくないですか? AI assistant を migration skill に向けてください。 これは焦点を絞った、source-verified な手順で、あなたの v4 config を検出し、上記の mapping を適用し、menu を再構成し、なくなったものを削除し、build を verify します — それから umbrella skill を渡し、assistant が新しい v5 features の採用を手伝える ようにします。

  • Migration skill: SKILLS/migrate-v4-to-v5/SKILL.mdumbrella skill と同じ方法で download してください:

    CODE
    curl -O https://raw.githubusercontent.com/ankitskvmdam/clean-jsdoc-theme/master/SKILLS/migrate-v4-to-v5/SKILL.md

    それを assistant に添付し(または .claude/skills/ に置き)、 "migrate my project from clean-jsdoc-theme v4 to v5." と伝えてください。

  • Canonical reference: 網羅的な MIGRATION.md と machine-readable な migration-map.json が skill を支えています — codemods に役立ちます。

関連項目