Needle Engine ドキュメント
Downloads
  • What is Needle Engine?
  • お客様の声
  • Get an overview

    • Samples and Showcase
    • 私たちのビジョン 🔮
    • 機能概要
    • 技術概要
  • Resources

    • Pricing and Plans
    • Changelog
    • API Documentation
    • Support & Community
  • Integrations

    • Unity用Needle Engine
    • Blender 用 Needle Engine
    • Web ComponentとしてのNeedle Engine
    • ウェブサイトでのNeedle Engine
    • Needle Cloud
  • Topics

    • Webプロジェクトの構造
    • Everywhere Actions
    • glTFへのアセットのエクスポート
    • フレームワーク、バンドラー、HTML
    • ローカルデバイスでのテスト
    • デプロイと最適化
  • Advanced

    • ネットワーキング
    • VR & AR (WebXR)
    • HTMLからNeedle Engineを直接使用する
    • Editor Sync
  • Troubleshooting

    • デバッグの方法
    • よくある質問(FAQ)💡
    • Get Help
  • Videos

    • Tutorials on Youtube
    • Interviews on Youtube
  • Scripting Overview

    • Needle Engineでのスクリプティング
    • Unity開発者向けスクリプト入門
    • Needleコアコンポーネント
    • Everywhere Actions
  • Components and Lifecycle

    • Creating and using Components
    • @serializable およびその他のデコレーター
    • 自動コンポーネント生成
    • Scripting Examples
    • Community Contributions
    • 追加モジュール
  • Settings and APIs

    • <needle-engine> 設定
    • /lang/ja/reference/needle-config-json.html
    • Needle Engine API
    • three.js API
Help
Samples
Pricing
  • Needle Website
  • Needle Cloud
  • Support Community
  • Discord Server
  • X/Twitter
  • YouTube
  • Newsletter
  • Email
  • Feedback
  • Github
  • English
  • 简体中文
  • Español
  • Português
  • Français
  • हिन्दी
  • 日本語
  • Deutsch
  • Tiếng Việt
Downloads
  • What is Needle Engine?
  • お客様の声
  • Get an overview

    • Samples and Showcase
    • 私たちのビジョン 🔮
    • 機能概要
    • 技術概要
  • Resources

    • Pricing and Plans
    • Changelog
    • API Documentation
    • Support & Community
  • Integrations

    • Unity用Needle Engine
    • Blender 用 Needle Engine
    • Web ComponentとしてのNeedle Engine
    • ウェブサイトでのNeedle Engine
    • Needle Cloud
  • Topics

    • Webプロジェクトの構造
    • Everywhere Actions
    • glTFへのアセットのエクスポート
    • フレームワーク、バンドラー、HTML
    • ローカルデバイスでのテスト
    • デプロイと最適化
  • Advanced

    • ネットワーキング
    • VR & AR (WebXR)
    • HTMLからNeedle Engineを直接使用する
    • Editor Sync
  • Troubleshooting

    • デバッグの方法
    • よくある質問(FAQ)💡
    • Get Help
  • Videos

    • Tutorials on Youtube
    • Interviews on Youtube
  • Scripting Overview

    • Needle Engineでのスクリプティング
    • Unity開発者向けスクリプト入門
    • Needleコアコンポーネント
    • Everywhere Actions
  • Components and Lifecycle

    • Creating and using Components
    • @serializable およびその他のデコレーター
    • 自動コンポーネント生成
    • Scripting Examples
    • Community Contributions
    • 追加モジュール
  • Settings and APIs

    • <needle-engine> 設定
    • /lang/ja/reference/needle-config-json.html
    • Needle Engine API
    • three.js API
Help
Samples
Pricing
  • Needle Website
  • Needle Cloud
  • Support Community
  • Discord Server
  • X/Twitter
  • YouTube
  • Newsletter
  • Email
  • Feedback
  • Github
  • English
  • 简体中文
  • Español
  • Português
  • Français
  • हिन्दी
  • 日本語
  • Deutsch
  • Tiếng Việt
  • Getting Started

    • Downloads
    • Needle Engine for Unity
    • Needle Engine for Blender
    • Needle Engine as Web Component
    • Needle Engine on your Website
    • Needle Cloud
    • Custom integrations
    • Support and Community
  • Core Concepts

    • Webプロジェクトの構造
    • Everywhere Actions
    • glTFへのアセットのエクスポート
    • フレームワーク、バンドラー、HTML
    • ローカルデバイスでのテスト
    • デプロイと最適化
    • デバッグの方法
    • よくある質問(FAQ)💡
  • Scripting

    • Needle Engineでのスクリプティング
    • Unity開発者向けスクリプト入門
    • Creating and using Components
    • 自動コンポーネント生成
    • Scripting Examples
    • Community Contributions
  • Advanced

    • VR & AR (WebXR)
    • ネットワーキング
    • Editor Sync
  • Reference

    • 機能概要
    • 技術概要
    • Needleコアコンポーネント
    • /lang/ja/reference/needle-config-json.html
    • <needle-engine> 設定
    • @serializable およびその他のデコレーター

glTFを扱うための便利なリソース

glTFまたはglbファイルをオンラインで検査するには:

  • gltf.report - three.jsベース
  • modelviewer.dev/editor - three.jsベース
  • Khronos glTF Sample Viewer
  • Babylon Sandbox
  • glTF Validator

ローカルで検査するには:

  • glTF Shell Extension for Windowsを使用して、glTFとglbの間で変換する
  • glTF Tools VS Code Extensionを使用して、ローカルで検証エラーやエンジン内プレビューを確認する

組み込みのURLパラメータ

デバッグフラグはURLクエリパラメータとして追加できます。 利用可能なすべてのパラメータのリストを取得するには、?help を使用します。

最もよく使用されるものをいくつか紹介します:

  • help 利用可能なすべてのURLパラメータをコンソールに出力します
  • console 画面上の開発コンソールを開きます。モバイルデバッグに便利です
  • printGltf ロードされたglTFファイルをコンソールに記録します
  • stats FPSモジュールを表示し、数秒ごとにthree.jsレンダラーの統計情報を記録します
  • showcolliders 物理コライダーを可視化します
  • gizmos ギズモレンダリングを有効にします(例:BoxColliderまたはAxesHelperコンポーネントを使用する場合)
  • その他多数:すべてを確認するには、help を使用してください

デバッグメソッド

Needle Engineには、静的クラスである Gizmos の一部として、非常に強力で便利なデバッグメソッドがいくつかあります。スクリプトドキュメントで詳細を確認してください。

リリースビルドのローカルテスト

  • まず、http-serverをインストールします:npm install -g http-server
  • ビルドを作成します(開発用または製品版)
  • コマンドラインツールでdistディレクトリを開きます
  • http-server -g を実行します | -g はgzipサポートを有効にします
  • オプション:WebXRをテストしたい場合は、自己署名SSL証明書を生成し、http-server -g -S を実行してhttpsを有効にします(WebXRには必須)。

VSCode

実行中のローカルサーバーにVSCodeをアタッチして、ブレークポイントを設定し、コードをデバッグできます。VSCodeでのデバッグについては、こちらで詳細を確認できます。

Webプロジェクトの.vscode/launch.jsonに以下の内容でlaunch.jsonファイルを作成します:

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Attach Chrome",
            "url": "https://localhost:3000",
            "webRoot": "${workspaceFolder}"
        }
    ]
}

サーバーが開始するポートを変更した場合は、それに応じてurlフィールドを更新してください。 その後、VSCode内からローカルサーバーを起動できます:

モバイル

Androidデバッグ

Androidデバッグの場合、Chrome Dev Toolsをデバイスにアタッチし、PCから直接ログを確認できます。デバイスを開発モードに切り替え、USB経由で接続する必要があります。

公式のChromeドキュメントはこちらをご覧ください

  • お使いの携帯電話で開発者向けオプションが有効になっていることを確認してください
  • USB経由で携帯電話をコンピュータに接続します
  • ブラウザでこのURL chrome://inspect/#devices を開きます
  • モバイルデバイスで、USB接続をコンピュータに許可します
  • コンピュータのChromeで、しばらくすると開いているタブのリストが表示されるはずです(chrome://inspect/#devices上)
  • デバッグしたいタブで Inspect をクリックします

iOSデバッグ

簡単なiOSデバッグのために、?console URLパラメータを追加すると、便利な画面上のJavaScriptコンソールが得られます。

Macをお持ちの場合は、Safariにアタッチすることもできます(上記のAndroidワークフローと同様)。

iOSでのWebXRの使用とデバッグには、サードパーティ製のブラウザであるMozilla WebXR Viewerを使用する必要があります。

Questデバッグ

Questは単なるAndroidデバイスです - 手順についてはAndroidデバッグセクションを参照してください。

このページはAIによって自動的に翻訳されました

Suggest changes
最終更新:: 2025/06/11 12:25
Prev
デプロイと最適化
Next
よくある質問(FAQ)💡