mcpField
W
workleap-web-configs

workleap-web-configs

github.com/workleap開発649 回インストール3 日前に更新
リポジトリ

workleap-web-configs について

workleap-web-configsは、Webツール向けのWorkleap共通設定ライブラリです。Webアプリやライブラリを開発するチーム向けに、Lint、型チェック、ブラウザー対象、バンドルの拡張可能な初期設定を提供します。

主な機能

  1. 01共有ESLint設定
  2. 02TypeScript型チェック設定
  3. 03StylelintとBrowserslist設定
  4. 04RsbuildとRslibのバンドラー設定
  5. 05拡張・上書き可能な初期設定

活用シーン

  1. 01WebアプリのLint設定
  2. 02ライブラリの型チェック設定
  3. 03アプリのブラウザー対象の指定
  4. 04RsbuildまたはRslibのビルド設定

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/workleap/wl-web-configs --skill workleap-web-configs

インストール後、Claude Code で/workleap-web-configsを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

references/
ci.md
eslint.md
rsbuild.md
rslib.md
stylelint.md
typescript.md

詳細

wl-web-configs

Web ツール向けの Workleap 共有設定ライブラリです。ESLint、TypeScript、Rsbuild、Rslib、Stylelint、Browserslist 向けの事前設定済みパッケージを提供します。

基本方針

  • ロックインなし:デフォルト設定は常に拡張または上書きできます
  • プロジェクトの種類別:設定は内部で構成され、使いやすいようプロジェクトの種類ごとに提供されます
  • デフォルトで ESM/ESNext:最新の JavaScript 環境を対象とします
  • NPM 経由で配布:パッケージのバージョンを上げるだけで、新機能を簡単に導入できます

サポート対象ツール(アクティブ)

ツールパッケージ用途
Browserslist@workleap/browserslist-configアプリのブラウザー対象
ESLint@workleap/eslint-configsコードのリント
Stylelint@workleap/stylelint-configsCSS のリント
TypeScript@workleap/typescript-configs型チェック(リントのみ)
Rsbuild@workleap/rsbuild-configsWeb アプリケーションのバンドル
Rslib@workleap/rslib-configsライブラリのバンドル

メンテナンスモード(推奨しない):PostCSS、SWC、webpack、tsup

クイックリファレンス

使用する設定の選び方
プロジェクトの種類ESLintTypeScriptバンドラー
React を使用する Web アプリdefineWebApplicationConfigweb-application.json@workleap/rsbuild-configs
React ライブラリdefineReactLibraryConfiglibrary.json@workleap/rslib-configs
TypeScript ライブラリ(React なし)defineTypeScriptLibraryConfiglibrary.json@workleap/rslib-configs
モノレポのワークスペースルートdefineMonorepoWorkspaceConfigmonorepo-workspace.jsonN/A
Browserslist(アプリのみ)
pnpm add -D @workleap/browserslist-config browserslist
# .browserslistrc
extends @workleap/browserslist-config

アプリケーションのバンドルを出力するプロジェクトでのみ使用してください。ライブラリには Browserslist を含めないでください。最終的な出力対象は、利用側アプリケーションの Browserslist によって制御されます。

共有設定を使用しながらカスタムのブラウザー対象を追加するには、次のようにします。

# .browserslistrc
extends @workleap/browserslist-config
IE 11
last 2 OperaMobile 12.1 versions

リファレンスガイド

包括的なセットアップガイド、オプション、例については、該当するリファレンスファイルをお読みください。

  • ESLint — references/eslint.md:インストール、define*Config 関数、ルールのカテゴリ、カスタマイズ、VS Code との統合、ESLint 8 からの移行
  • TypeScript — references/typescript.md:プロジェクトの種類別の設定ファイル、コンパイラーオプションの上書き、パスマッピング、CLI スクリプト、tsgo への移行
  • Rsbuild — references/rsbuild.md:開発/ビルド/Storybook の設定、事前定義オプション、トランスフォーマー、Turborepo のセットアップ、webpack からの移行
  • Rslib — references/rslib.md:ライブラリのビルド/開発/Storybook の設定、バンドルレスとバンドル、トランスフォーマー、型宣言、tsup からの移行
  • Stylelint — references/stylelint.md:インストール、.stylelintrc.json のセットアップ、Prettier との統合、VS Code の設定
  • CI — references/ci.md:ポリレポおよび Turborepo ソリューション向け GitHub Actions ワークフロー。Turborepo のキャッシュと PR フィルターを含みます

重要なルール

  1. ドキュメントに記載された API を使用してください — これらのパッケージは薄いラッパーであり、ドキュメントに記載されていないオプションは基盤となるツールに渡されません
  2. メンテナンスモードのパッケージは避けてください — PostCSS、SWC、webpack、tsup の設定には新機能が追加されません。代わりにアクティブな代替ツール(Rsbuild、Rslib、Stylelint)を推奨してください
  3. デフォルトで ESM — Workleap のツールチェーンは最新の JavaScript 環境を前提としているため、すべての設定は ESM/ESNext を対象とします
  4. Browserslist はアプリのみ — 最終的な出力対象は利用側アプリケーションの設定で制御されるため、ライブラリでは Browserslist を省略します
  5. TypeScript はリント用 — 共有 TypeScript 設定は型チェックに重点を置いています。トランスパイルはバンドラーが処理するため、役割を混在させないでください

コメント