본문으로 건너뛰기
cccskills
무료GitHub에 공개

node-project-setup

Configure a Node.js project with pnpm, TypeScript, latest versions, and parallel script patterns following modern best practices

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

설치 방법 보기

포함된 파일(2)

  • SKILL.md5.0 KB
  • README.md1.2 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

Node.js プロジェクトを現代のベストプラクティスに従ってセットアップ・設定します。 既存プロジェクトへの適用も、新規プロジェクトの初期化も対象とします。

1. Package Manager: pnpm を選択

pnpm を基本パッケージマネージャーとして使用します。

最新版のインストール:

# 最新バージョンを確認してからインストール
npm install -g pnpm@latest
# または Corepack を使う場合
corepack enable && corepack prepare pnpm@latest --activate

package.json に packageManager フィールドを設定して pnpm バージョンを固定します:

{
  "packageManager": "pnpm@X.Y.Z"
}

バージョンは pnpm --version で確認した実際のバージョンを記載します。

2. Version Configuration

Node.js の最新バージョン確認:

# 最新の LTS バージョンを確認
node --version            # 現在の環境
# 公式サイト https://nodejs.org で最新 LTS を確認

package.json の engines フィールドで Node.js と pnpm のバージョン制約を明示します:

{
  "engines": {
    "node": ">=X.Y.Z",
    "pnpm": ">=X.Y.Z"
  }
}

バージョンには node --version / pnpm --version で確認した現在の最新版を記載します。

3. ESM (ES Modules) をデフォルトに

package.json に "type": "module" を設定して ESM を標準とします:

{
  "type": "module"
}

4. TypeScript のセットアップ

TypeScript を開発依存としてインストールします:

pnpm add -D typescript @types/node

tsconfig.json を作成します(strict + ESM 対応):

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "NodeNext",
    "moduleResolution": "NodeNext",
    "strict": true,
    "noUncheckedIndexedAccess": true,
    "exactOptionalPropertyTypes": true,
    "outDir": "dist",
    "rootDir": "src",
    "declaration": true,
    "declarationMap": true,
    "sourceMap": true,
    "skipLibCheck": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist"]
}

5. Lint / Format ツール

Rust 製の高速ツールを採用します:

pnpm add -D oxlint @oxc-project/oxfmt
  • oxlint — ESLint 互換の高速 linter
  • oxfmt — Biome 互換の高速 formatter

6. Script Organization: parallel check/fix パターン

pnpm run --parallel "/^check:.*/" パターンを使って、check: プレフィックスを持つスクリプトをすべて並列実行します。 同様に fix: プレフィックスで自動修正系タスクをまとめます。

{
  "scripts": {
    "build": "tsc",
    "check": "pnpm run --parallel \"/^check:.*/\"",
    "check:types": "tsc --noEmit",
    "check:lint": "oxlint",
    "check:fmt": "oxfmt --check",
    "fix": "pnpm run --parallel \"/^fix:.*/\"",
    "fix:lint": "oxlint --fix",
    "fix:fmt": "oxfmt"
  }
}

パターンの原則:

  • 並列実行可能なチェック系タスクはすべて check: プレフィックスを付ける
  • 自動修正系タスクはすべて fix: プレフィックスを付ける
  • check / fix スクリプトは常に正規表現 + parallel で実行する(個別スクリプトを直接列挙しない)
  • 新しいチェック/修正を追加する際は check:xxx / fix:xxx として追加するだけで自動的に含まれる

同様のパターンを test: など他のカテゴリにも適用できます:

{
  "test": "pnpm run --parallel \"/^test:.*/\""
}

7. .npmrc 設定

pnpm のデフォルト挙動を守るために .npmrc を作成します:

shamefully-hoist=false
strict-peer-dependencies=false

8. package.json の完成形

以下を組み合わせた package.json の例:

{
  "name": "my-project",
  "version": "0.1.0",
  "type": "module",
  "packageManager": "pnpm@X.Y.Z",
  "engines": {
    "node": ">=X.Y.Z",
    "pnpm": ">=X.Y.Z"
  },
  "scripts": {
    "build": "tsc",
    "check": "pnpm run --parallel \"/^check:.*/\"",
    "check:types": "tsc --noEmit",
    "check:lint": "oxlint",
    "check:fmt": "oxfmt --check",
    "fix": "pnpm run --parallel \"/^fix:.*/\"",
    "fix:lint": "oxlint --fix",
    "fix:fmt": "oxfmt"
  },
  "devDependencies": {
    "@oxc-project/oxfmt": "latest",
    "@types/node": "latest",
    "oxlint": "latest",
    "typescript": "latest"
  }
}

Verification

セットアップ完了後に以下を実行して確認します:

pnpm install
pnpm check        # 型チェック・lint・フォーマットをすべて並列実行
pnpm fix          # lint・フォーマットの自動修正をすべて並列実行
pnpm build        # TypeScript のビルド確認

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

This skill should be used when the user asks to "プロジェクトを解析して", "コードベースを調べてドキュメント化して", "移行作業の準備をして", "新機能実装の前にプロジェクトを整理して", "analyze this codebase", "document the project structure", "既存プロジェクトのCLAUDE.mdを作って", or wants to prepare CLAUDE.md and architecture docs before a migration, feature development, or onboarding.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

t6adev/claude-code-tools32026년 4월 9일 업데이트

This skill should be used when the user asks to "このエラーを直して", "help me debug this", "fix this stack trace", "なぜこのエラーが出るの", "CI が落ちた", or pastes an error message or stack trace and wants help diagnosing it. Classifies the error type, identifies related files, and proposes up to three root-cause hypotheses with concrete fix plans.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

t6adev/claude-code-tools32026년 4월 9일 업데이트

doc-sync

무료

This skill should be used when the user asks to "ドキュメントを更新して", "sync the docs", "update CLAUDE.md after this change", "実装に合わせてドキュメントを直して", or notices that docs have drifted from the codebase. Diffs git history to identify what changed, proposes targeted updates to CLAUDE.md, docs/architecture.md, docs/requirements.md, and README.md, then applies only approved changes.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

t6adev/claude-code-tools32026년 4월 9일 업데이트

explain

무료

Explain selected code or a specified file/function in plain language, including what it does, why it exists, and potential pitfalls

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

t6adev/claude-code-tools32026년 4월 9일 업데이트

This skill should be used when the user asks to "このファイルを変えたら何が壊れる?", "what depends on this function", "影響範囲を調べて", "show me what imports this module", or wants to understand the blast radius before modifying a shared utility, exported type, or public API. Traces import/require references up to two levels deep and lists affected test files.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

t6adev/claude-code-tools32026년 4월 9일 업데이트

This skill should be used when the user asks to "このIssueを実装して", "implement this issue", "fix this bug", "このタスクをやって", "Issue

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

t6adev/claude-code-tools32026년 4월 9일 업데이트

t6adev의 스킬 모두 보기

이 스킬의 문제 신고