mcpField
R
rspack

rspack

github.com/full-stack-skills開発057 回インストール4 週間前に更新
リポジトリ

rspack について

rspack は、Rspack プロジェクトを構築・保守する開発者向けのドキュメント型スキルです。設定、プラグイン、API、移行、ビルド最適化の例をテーマ別に整理しています。

主な機能

  1. 01プロジェクト導入と環境設定
  2. 02プラグインとローダーのガイド
  3. 03CLI と JavaScript API の例
  4. 04Webpack からの移行ガイド
  5. 05ビルドとコード分割の最適化

活用シーン

  1. 01開発・本番ビルドの設定
  2. 02カスタムプラグインやローダーの作成
  3. 03Webpack からプロジェクトを移行
  4. 04設定やビルドの問題を調査

インストール

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

$npx skills add https://github.com/full-stack-skills/build-skills --skill rspack

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

同梱ファイル

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

agents/
openai.yaml
api/
cli.md
javascript-api.md
loader-api.md
plugin-api.md
runtime-api.md
examples/api/
cli.md
index.md
examples/api/javascript-api/
browser.md
cache.md
compilation.md
compiler.md
index.md
logger.md
resolver.md
stats-json.md
stats.md
swc.md
examples/api/loader-api/
context.md
index.md
inline-match-resource.md
inline.md
writing-loaders.md
examples/api/plugin-api/
compilation-hooks.md
compiler-hooks.md
context-module-factory-hooks.md
index.md
javascript-modules-plugin-hooks.md
normal-module-factory-hooks.md
runtime-plugin-hooks.md

詳細

このスキルを使用するタイミング

ユーザーが次のことを求めている場合は、このスキルを使用してください。

  • 新規または既存のプロジェクトに Rspack をセットアップする
  • さまざまな環境向けに Rspack を設定する
  • 組み込みプラグインを使用する、またはカスタムプラグインを作成する
  • Webpack から Rspack に移行する
  • ビルドパフォーマンスを最適化する
  • Rspack の設定オプションを理解する
  • Rspack CLI または JavaScript API を使用する
  • カスタムローダーを作成する
  • プラグイン API とフックを理解する
  • エントリーポイントと出力を設定する
  • コード分割と最適化をセットアップする
  • 開発サーバーを設定する
  • アセットとリソースを扱う
  • Rspack で TypeScript を使用する
  • Rspack の問題をトラブルシューティングする

このスキルの使用方法

このスキルは、Rspack の公式ドキュメントの構成（https://rspack.rs/zh/guide/start/introduction、https://rspack.rs/zh/config/、https://rspack.rs/zh/plugins/、https://rspack.rs/zh/api/）に合わせて整理されています。Rspack を使用する場合：

  1. ユーザーのリクエストからトピックを特定します。

    • はじめに／クイックスタート → examples/guide/start/
    • 設定 → examples/config/
    • プラグイン → examples/plugins/
    • API → examples/api/

  2. examples/ ディレクトリから適切なサンプルファイルを読み込みます。

    ガイド - examples/guide/：

    • examples/guide/compatibility/plugin.md
    • examples/guide/features/asset-base-path.md
    • examples/guide/features/asset-module.md
    • examples/guide/features/builtin-lightningcss-loader.md
    • examples/guide/features/builtin-swc-loader.md
    • examples/guide/features/dev-server.md
    • examples/guide/features/esm.md
    • examples/guide/features/layer.md
    • examples/guide/features/lazy-compilation.md
    • examples/guide/features/loader.md
    • examples/guide/features/module-federation.md
    • examples/guide/features/module-resolution.md
    • examples/guide/features/plugin.md
    • examples/guide/features/web-workers.md
    • examples/guide/migration/cra.md
    • examples/guide/migration/rspack_0.x.md
    • examples/guide/migration/storybook.md
    • examples/guide/migration/webpack.md
    • examples/guide/optimization/analysis.md
    • examples/guide/optimization/code-splitting.md
    • examples/guide/optimization/lazy-barrel.md
    • examples/guide/optimization/production.md
    • examples/guide/optimization/profile.md
    • examples/guide/optimization/tree-shaking.md
    • examples/guide/optimization/use-rsdoctor.md
    • examples/guide/start/ecosystem.md
    • examples/guide/start/introduction.md
    • examples/guide/start/quick-start.md
    • examples/guide/tech/css.md
    • examples/guide/tech/json.md
    • examples/guide/tech/nestjs.md
    • examples/guide/tech/next.md
    • examples/guide/tech/preact.md
    • examples/guide/tech/react.md
    • examples/guide/tech/solid.md
    • examples/guide/tech/svelte.md
    • examples/guide/tech/typescript.md
    • examples/guide/tech/vue.md

    設定 - examples/config/：

    • examples/config/cache.md
    • examples/config/context.md
    • examples/config/deprecated-options.md
    • examples/config/dev-server.md
    • examples/config/devtool.md
    • examples/config/entry.md
    • examples/config/experiments.md
    • examples/config/extends.md
    • examples/config/externals.md
    • examples/config/filename-placeholders.md
    • examples/config/index.md
    • examples/config/infrastructure-logging.md
    • examples/config/lazy-compilation.md
    • examples/config/mode.md
    • examples/config/module-rules.md
    • examples/config/module.md
    • examples/config/node.md
    • examples/config/optimization-optimizationsplitchunks.md
    • examples/config/optimization.md
    • examples/config/other-options.md
    • examples/config/output.md
    • examples/config/performance.md
    • examples/config/plugins.md
    • examples/config/resolve-loader.md
    • examples/config/resolve.md
    • examples/config/stats.md
    • examples/config/target.md
    • examples/config/watch.md Plugins (プラグイン) - examples/plugins/:
    • examples/plugins/index.md
    • examples/plugins/rspack/circular-dependency-rspack-plugin.md
    • examples/plugins/rspack/copy-rspack-plugin.md
    • examples/plugins/rspack/css-chunking-plugin.md
    • examples/plugins/rspack/css-extract-rspack-plugin.md
    • examples/plugins/rspack/esm-library-plugin.md
    • examples/plugins/rspack/html-rspack-plugin.md
    • examples/plugins/rspack/lightning-css-minimizer-rspack-plugin.md
    • examples/plugins/rspack/subresource-integrity-plugin.md
    • examples/plugins/rspack/swc-js-minimizer-rspack-plugin.md
    • examples/plugins/rspack/virtual-modules-plugin.md
    • examples/plugins/webpack/banner-plugin.md
    • examples/plugins/webpack/case-sensitive-plugin.md
    • examples/plugins/webpack/context-replacement-plugin.md
    • examples/plugins/webpack/define-plugin.md
    • examples/plugins/webpack/dll-plugin.md
    • examples/plugins/webpack/dll-reference-plugin.md
    • examples/plugins/webpack/electron-target-plugin.md
    • examples/plugins/webpack/enable-chunk-loading-plugin.md
    • examples/plugins/webpack/enable-library-plugin.md
    • examples/plugins/webpack/enable-wasm-loading-plugin.md
    • examples/plugins/webpack/entry-plugin.md
    • examples/plugins/webpack/environment-plugin.md
    • examples/plugins/webpack/eval-source-map-dev-tool-plugin.md
    • examples/plugins/webpack/externals-plugin.md
    • examples/plugins/webpack/hot-module-replacement-plugin.md
    • examples/plugins/webpack/ignore-plugin.md
    • examples/plugins/webpack/index.md
    • examples/plugins/webpack/internal-plugins.md
    • examples/plugins/webpack/javascript-modules-plugin.md
    • examples/plugins/webpack/limit-chunk-count-plugin.md
    • examples/plugins/webpack/module-federation-plugin-v1.md
    • examples/plugins/webpack/module-federation-plugin.md
    • examples/plugins/webpack/no-emit-on-errors-plugin.md
    • examples/plugins/webpack/node-target-plugin.md
    • examples/plugins/webpack/node-template-plugin.md
    • examples/plugins/webpack/normal-module-replacement-plugin.md
    • examples/plugins/webpack/progress-plugin.md
    • examples/plugins/webpack/provide-plugin.md
    • examples/plugins/webpack/runtime-chunk-plugin.md
    • examples/plugins/webpack/source-map-dev-tool-plugin.md
    • examples/plugins/webpack/split-chunks-plugin.md

    API Reference - examples/api/:

    • examples/api/cli.md
    • examples/api/index.md
    • examples/api/javascript-api/browser.md
    • examples/api/javascript-api/cache.md
    • examples/api/javascript-api/compilation.md
    • examples/api/javascript-api/compiler.md
    • examples/api/javascript-api/index.md
    • examples/api/javascript-api/logger.md
    • examples/api/javascript-api/resolver.md
    • examples/api/javascript-api/stats-json.md
    • examples/api/javascript-api/stats.md
    • examples/api/javascript-api/swc.md
    • examples/api/loader-api/context.md
    • examples/api/loader-api/index.md
    • examples/api/loader-api/inline-match-resource.md
    • examples/api/loader-api/inline.md
    • examples/api/loader-api/writing-loaders.md
    • examples/api/plugin-api/compilation-hooks.md
    • examples/api/plugin-api/compiler-hooks.md
    • examples/api/plugin-api/context-module-factory-hooks.md
    • examples/api/plugin-api/index.md
    • examples/api/plugin-api/javascript-modules-plugin-hooks.md
    • examples/api/plugin-api/normal-module-factory-hooks.md
    • examples/api/plugin-api/runtime-plugin-hooks.md
    • examples/api/plugin-api/stats-hooks.md
    • examples/api/runtime-api/hmr.md
    • examples/api/runtime-api/module-methods.md
    • examples/api/runtime-api/module-variables.md

  3. そのサンプルファイル内の具体的な指示に従って、構文、構造、ベストプラクティスを確認してください 重要な注意事項：

    • Rspack は、ほとんどの Webpack プラグインおよびローダーと互換性があります
    • 設定形式は Webpack に似ています
    • Rspack は Webpack より優れたパフォーマンスを提供します
    • 例には JavaScript 版と TypeScript 版の両方が含まれています
    • 各サンプルファイルには、パラメーター、戻り値、一般的なエラー、ベストプラクティス、使用シナリオが含まれています

  4. 必要に応じて公式ドキュメントを参照してください：

ベストプラクティス

  1. 設定には TypeScript を使用してください：型安全性が高まり、オートコンプリートも利用できます
  2. 組み込みプラグインを活用してください：利用可能な場合は Rspack のプラグインを使用します
  3. 本番環境向けに最適化してください：ビルドには本番モードを使用します
  4. コード分割：パフォーマンスを高めるため、optimization.splitChunks を使用します
  5. キャッシュの設定：再ビルドを高速化するため、永続キャッシュを有効にします
  6. HMR を使用してください：開発体験を向上させるため、ホットモジュール置換を有効にします

リソース

キーワード

Rspack, rspack, バンドラー, webpack, rust, ビルドツール, バンドリング, コード分割, HMR, ホットモジュール置換, ローダー, プラグイン, 設定, エントリー, 出力, 最適化, 開発サーバー, パッケージ化ツール, ビルドツール, コード分割, ホットモジュール置換, ローダー, プラグイン, 設定, エントリー, 出力, 最適化, 開発サーバー

コメント

Markdown 対応