sapui5-linter

SAPUI5 Linter スキル

関連スキル

• sap-dependency-security: UI5 のリント用ツールチェーンをアップグレードし、プラグイン／ツールチェーンのロックファイルを管理して依存関係を強化する場合に使用します

このスキルを使用する場合

@ui5/linter の追加または実行、UI5 のリントルールの設定、UI5 2.x への移行準備、非推奨 API／グローバル変数／マニフェストの問題の自動修正、CI レポートの作成、または ui5lint の解析、パフォーマンス、設定の動作に関するトラブルシューティングを行う場合に、このスキルを使用します。

目次

• 概要
• クイックスタート
• 設定
• CLI の使用方法
• 同梱リソース

概要

UI5 Linter（@ui5/linter）は、SAPUI5 および OpenUI5 プロジェクト専用に設計された静的コード解析ツールです。UI5 2.x へのアップグレード前に、互換性の問題、非推奨 API、セキュリティ上の懸念、ベストプラクティスへの違反を開発者が特定できるようにします。

主な機能：

• ✅ 非推奨 API、グローバル変数の使用、CSP 違反など、19 カテゴリーの問題を検出します
• ✅ 一般的な問題を自動修正します（no-globals、no-deprecated-api、マニフェストプロパティ）
• ✅ JavaScript、TypeScript、XML、JSON、HTML、YAML ファイルに対応します
• ✅ 無視するパターンと対象ファイルを設定できます
• ✅ 複数の出力形式に対応します：stylish、JSON、Markdown、HTML
• ✅ 高速に動作します：プロジェクトの規模に応じて 1〜40 秒

現在のバージョン：1.22.0（2026-06-14 に npm で確認） 公式リポジトリ：https://github.com/UI5/linter

---

クイックスタート

前提条件

Node.js：v20.11.x、v22.0.0、またはそれ以降 npm：v8.0.0 以上

前提条件を確認します：

node --version  # Should be v20.11+ or v22+
npm --version   # Should be v8+

インストール

グローバルインストール（CLI の使用に推奨）：

npm install --global @ui5/linter

ローカルインストール（プロジェクトへの統合に推奨）：

npm install --save-dev @ui5/linter

インストールを確認します：

ui5lint --version  # Should output: 1.22.0 or higher

基本的な使い方

プロジェクトのルートからリンターを実行します：

# Lint entire project
ui5lint

# Lint specific files or directories
ui5lint "webapp/**/*.js"
ui5lint "webapp/controller/" "webapp/view/"

# Show detailed information about findings
ui5lint --details

一般的なワークフロー

開発ワークフロー：

# 1. Check for issues with details
ui5lint --details

# 2. Preview automatic fixes
UI5LINT_FIX_DRY_RUN=true ui5lint --fix

# 3. Apply fixes
ui5lint --fix

# 4. Review changes
git diff

# 5. Verify fixes worked
ui5lint --details

設定

設定ファイルのセットアップ

ui5lint.config.{js|mjs|cjs} を作成します：

module.exports = {
  rules: {
    // Recommended rules
    "no-deprecated-api": "error",
    "no-globals": "error",
    "no-ambiguous-event-handler": "error",
    "no-outdated-manifest-version": "error"
  },
  exclude: [
    "dist/**",
    "node_modules/**",
    "test/**/*.{spec,js,ts}"
  ]
};

一般的な設定パターン

// Strict for production, relaxed for development
const isProduction = process.env.NODE_ENV === 'production';

module.exports = {
  rules: {
    "no-deprecated-api": isProduction ? "error" : "warn",
    "no-globals": isProduction ? "error" : "warn"
  },
  exclude: [
    "legacy/**/*",
    "**/*.min.js"
  ]
};

CLI の使用方法

基本的なコマンド

# Basic linting
ui5lint

# With detailed output
ui5lint --details

# Fix auto-fixable issues
ui5lint --fix

# JSON output for CI/CD
ui5lint --format json

# HTML report for documentation
ui5lint --format html --details

# Performance monitoring
ui5lint --perf

リントルールの概要

非同期処理とモダンなパターン

• async-component-flags：非同期コンポーネントの設定を検証します
• prefer-test-starter：Test Starter の実装を検証します

セキュリティ

• csp-unsafe-inline-script：安全でないインラインスクリプトを検出します

イベントハンドラー

• no-ambiguous-event-handler：適切なイベントハンドラーの記法を保証します ✅ 自動修正

非推奨項目の検出（7 ルール）

• no-deprecated-api：非推奨 API を検出します ✅
• no-deprecated-component：非推奨のコンポーネント依存関係を特定します
• no-deprecated-control-renderer：コントロールレンダラーのパターンを検証します
• no-deprecated-library：マニフェスト内の非推奨ライブラリを確認します

グローバル変数の使用

• no-globals：グローバル変数の使用を特定します ✅ 自動修正
• no-implicit-globals：暗黙的なグローバルアクセスを検出します

エラー報告

• parsing-error：構文／解析エラーを報告します
• autofix-error：自動修正の失敗を報告します

API の使用

• ui5-class-declaration：UI5 クラス宣言のパターンを検証します（TypeScript）
• unsupported-api-usage：適切な API の使用を保証します

マニフェストの最新化（3 ルール）

• no-outdated-manifest-version：Manifest Version 2 を必須とします
• no-removed-manifest-property：互換性のないプロパティを特定します ✅ 自動修正

ルールの完全なリファレンス**：references/rules-complete.md を参照してください

開発ワークフローとの統合

package.json スクリプト

{
  "scripts": {
    "lint": "ui5lint",
    "lint:fix": "ui5lint --fix",
    "lint:details": "ui5lint --details",
    "lint:ci": "ui5lint --quiet --format json > lint-results.json",
    "lint:report": "ui5lint --format html --details > lint-report.html"
  },
  "devDependencies": {
    "@ui5/linter": "^1.22.0"
  }
}

一般的なシナリオ

シナリオ 1：新しい UI5 プロジェクトのセットアップ

1. リンターをインストールします
2. 設定を作成します（テンプレートを使用）
3. package.json に npm スクリプトを追加します
4. 初回のリントを実行します
5. 自動修正可能な問題を修正します
6. 残りの問題を確認します

シナリオ 2：UI5 2.x への移行準備

1. リンターを実行して、すべての問題を見つけます
2. まず重大な問題に取り組みます
3. 自動修正を適用します
4. 自動修正の制限に関するドキュメントを確認します
5. サポートされていない API を手動で修正します
6. Core API の問題（#619、#620）に対処します
7. manifest を v2 に更新します
8. no-outdated-manifest-version、no-removed-manifest-property の問題を修正します
9. すべての問題が解決されたことを確認します

トラブルシューティング

よくある問題

症状：リンターが解析エラーを報告する 解決策：設定ファイルに構文エラーがないか確認します

症状：自動修正が機能しない 解決策：references/autofix-complete.md で自動修正の制限を確認します

症状：大規模なコードベースでパフォーマンスの問題が発生する 解決策：除外パターンを追加し、対象を絞ってリンティングします

既知の制限事項

• 同期パターンを非同期パターンに変換できません
• Core/Configuration API の自動修正には制限があります（約 50 個の API）
• jQuery.sap API のサポートは基本的なメソッドに限られます
• Node.js モジュールは自動的に検出されません

ベストプラクティス

1. リンターは早い段階から頻繁に実行する

• すぐにフィードバックを得られるよう、コミット前フックを追加します
• templates/husky-pre-commit.template を参照してください

2. 永続的な設定には設定ファイルを使用する

• 環境固有の設定
• プロジェクト全体に適用する除外パターン

3. 問題を段階的に修正する

1. まずエラーを修正します
2. 次に警告を修正します
3. 各ステップの後に確認とテストを行います

4. 抑制したルールを文書化する

• チーム全体で適用する抑制は、理由とともに文書化します
• 使用は控えめにし、明確な根拠を示します

5. CI/CD と統合する

• エラーがある場合はビルドを失敗させ、警告は許容します
• 関係者向けにレポートを生成します

6. パフォーマンスを監視する

• リンティングのパフォーマンスを継続的に追跡します

---

リファレンスドキュメント

外部リソース

• 公式リポジトリ：https://github.com/UI5/linter
• 問題の報告：https://github.com/UI5/linter/issues
• ディスカッション：https://github.com/UI5/linter/discussions
• チャットサポート：https://discord.gg/sapui5
• SAP Community：https://community.sap.com/tags/ui5

詳細なドキュメント

• ルールの完全なリファレンス：references/rules-complete.md
• 自動修正機能：references/autofix-complete.md
• パフォーマンスガイド：references/performance.md
• トラブルシューティングガイド：references/support-and-community.md
• コントリビューションガイド：references/contributing.md

テンプレート

• 設定テンプレート：templates/ui5lint.config.mjs
• package.json テンプレート：templates/package.json.template
• Husky コミット前フック：templates/husky-pre-commit.template

サポートと更新情報

• バージョン：1.22.0（現行）
• リリースノート：GitHub のリリースで確認できます
• ロードマップ：GitHub の Issues と Discussions に記載されています
• メール：[email protected]
• コミュニティ：Discord の #sapui5 チャンネル

同梱リソース

リファレンスドキュメント

• references/rules-complete.md - 19 個すべてのリンティングルールの完全なリファレンス
• references/autofix-complete.md - 自動修正機能と制限事項の詳細
• references/performance.md - パフォーマンス最適化ガイド
• references/support-and-community.md - サポート窓口とコミュニティリソース
• references/contributing.md - コントリビューションガイドライン

テンプレート

• templates/ui5lint.config.mjs - 設定テンプレート
• templates/package.json.template - Package.json テンプレート
• templates/husky-pre-commit.template - コミット前フックのテンプレート

---

最終更新日：2026-06-14 | バージョン：2.4.1 前回の再構成バージョン：1.0.1 | 削減行数：376（827 行から） 次回レビュー：2026-02-25