メインコンテンツへスキップ

​
npm パッケージとは?

npm パッケージを使用して、自分ですべてを構築することなく、Base44 アプリケーションに強力な機能とツールを追加できます。Base44 は、アニメーション、データのフォーマット、チャートなどの信頼性が高く最新のコードライブラリにアクセスできる ai アプリビルダー であり、すべてエキスパート開発者によって作成されています。 npm パッケージを使用すると、数分で高度な機能を追加し、十分にテストされたコードに依存し、アプリをユニークにするものの作成に集中できます。
Npm
npm パッケージを、アプリにプラグインできる既製のコードの小さな箱と考えてください。誰かがすでにコードを書いています。パッケージをインストールするだけで、すぐにすべての機能を使用できます。
Base44 では、アプリに npm パッケージを簡単に追加できます。アプリエディタ内の AI チャットから、npm パッケージの追加をリクエストし、リクエストを確認し、インストールを承認できます。

npm パッケージの例

  • アニメーションライブラリ (例: anime.js)
  • チャートとグラフユーティリティ
  • 日付と時間のヘルパー
  • UI コンポーネント
  • ドラッグアンドドロップロジック
重要:すべての npm パッケージはサードパーティによって作成および保守されています。Base44 は、インストールする外部パッケージの品質、信頼性、またはセキュリティを保証できません。アプリで正しく動作することを確認するために、パッケージを常に慎重にテストおよび検証してください。使用するサードパーティパッケージがプロジェクトのニーズを満たしていることを確認する責任はあなたにあります。

​
npm パッケージを参照する

公開レジストリで npm パッケージを見つけることができます。各パッケージの README には詳細な手順、使用例、ピア依存関係の詳細が含まれているので、すぐに開始できます。
Base44 の npm Playground を使用して、npm パッケージの動作をプレビューし、アプリに直接プラグインしましょう。
Base44 npm パッケージを参照するには:
  1. npmjs.com にアクセスして、利用可能なすべての公開パッケージを表示します。
  2. 使用したいパッケージをクリックして、詳細ページを開きます。

​
アプリに npm パッケージを追加する

Base44 では、AI とチャットすることで npm パッケージを追加できます。ターミナルや手動インストールコマンドは必要ありません。 アプリに npm パッケージを追加するには:
  1. アプリエディタに移動します。
  2. AI チャットにインストールしたい npm パッケージを入力します。
  3. プロンプトが表示されたら、チャットで Approve をクリックします。
The approval window in the AI chat when installing an NPM package

​
npm パッケージの使用例

anime.js を使用して、アプリのページや要素に洗練された入場アニメーションを作成できます。例えば、ページが読み込まれるときにカード、ボタン、チャートをアニメーション化して、サイトをより魅力的に感じさせたいかもしれません。 次のようなプロンプトを追加するだけです: 
npm anime.js をインストールして、私のアプリを美しくして
AI チャットはインストールの承認を求めて、パッケージがアプリに直接インストールされます。
Installing an NPM package to your app in Base44
インストールされると、anime.js を使用してページセクション、アイコンなどをアニメーション化できます。

​
FAQ

詳しく学ぶには、以下の質問をクリックしてください。
Base44 は現在、公開 SDK を提供していません。ただし、この機能には Product Roadmap で投票できます。高度な開発者向けに、npm-base44/sdk パッケージが利用可能です。このパッケージを使用すると、特定のバックエンド関数を実行できます。
npm パッケージは 新しい Base44 インフラストラクチャ でのみサポートされています。エラーが発生している場合は、アプリを新しいインフラストラクチャに更新してください。更新が必要かどうかを確認するには:
  1. アプリエディタに移動します。
  2. トップバーの Update Infrastructure ボタンを探します。
  3. 表示されている場合は Update Infrastructure をクリックし、プロンプトに従います。
注意: Update Infrastructure ボタンが表示されない場合は、すでに新しいインフラストラクチャを使用しています。
npm パッケージがインストールされない、または保留状態で詰まる場合は、以下の手順を試してください:
  1. エラーの詳細についてチャットメッセージを確認します。AI チャットは、インストールをリクエストしているパッケージの依存関係や互換性の問題について説明することがあります。
  2. リクエストが正確なパッケージ名とバージョンに一致していることを確認します。
  3. インストールに承認が必要な場合、チャットパネルでリクエストを承認したことを確認します。
  4. インストールが失敗した場合は、チャットを使用してパッケージを再度リクエストしてみてください。
npm パッケージを追加したら、アプリから削除することはできません。ただし、npm パッケージをコードで使用していないがインストールされている場合、アプリへの影響はありません。npm パッケージを更新する必要がある場合は、AI チャットに依頼するだけで実行できます。
アプリにインストールされている npm パッケージを確認するには、AI チャットに尋ねることができます。
以下の推奨事項に従って、適切な npm パッケージを選択します。すぐにインストールするのではなく、各パッケージについて少し調査することで、信頼できるオプションを見つけて、後で問題を防ぐことができます。
  • ダウンロード統計: パッケージが npm でどれくらいのダウンロードがあるか確認します。強力なダウンロード履歴を持つパッケージは、開発コミュニティ内で一般的に信頼できると見なされています。
  • ドキュメントの品質: 十分にドキュメント化されたパッケージは通常、セットアップとトラブルシューティングをずっと簡単にします。明確な使用手順、例、API リファレンスを探してください。
  • ライセンスのタイプ: パッケージのライセンスがプロジェクトの要件に適合することを確認します。特に商用またはオープンソースのものを構築している場合に重要です。
  • バンドルサイズと依存関係: パッケージがアプリのパフォーマンスにどう影響するか、多くの新しい依存関係を追加するかを考慮します。軽量で集中したパッケージは、潜在的な競合と肥大化を減らします。
  • 更新アクティビティ: GitHub などのプロジェクトのリポジトリを確認して、更新が最近のものか、メンテナが質問やバグレポートに対処しているかを確認します。最新の状態に保たれているパッケージは通常、より安全で、現代のツールとより互換性があります。
  • コミュニティの意見: npm、GitHub、またはプログラミングフォーラムからのコメント、評価、ディスカッションを探ります。他の開発者の経験は、潜在的な問題を警告したり、パッケージが実際にどう機能するかをよりよく感じさせたりします。
このページは AI を使用して翻訳されました。最も正確で最新の情報については、英語版 を参照してください。