uni-app Scaffolding cli 作成プロジェクトと HBuilderX 作成プロジェクトの違い

uni-appプロジェクトの作成方法

HBuilderX ビジュアルインターフェイスは、IDE インターフェイスを通じて新しいプロジェクトを作成できます。
cmd コマンドラインモードを使用し、 cli スキャフォールディングを使用して、プロジェクトをvue-cli 作成できます。uni-app

参考：WebStormでユニアプリを開発 - vue2を使ってモバイルAPP(apk) +WeChatアプレットプロジェクト開発計画を Vue ファイルは Webview でレンダリングされます。Webview は、DOM 要素を解析し、HTML ページコントロールを表示できる Webkit ベースのエンジンです。ページを表示する原理はブラウザと同じであるため、ブラウザとみなすことができます。Nvueとはnative vueの略で、uni-appのレンダリング方式です。uni-appのレンダリング方式であるnative vueの略称です。_webstorm は uniapp を実行しますhttps://blog.csdn.net/LlanyW/article/details/128983789

cli によるプロジェクトの作成と HBuilderX ビジュアルインターフェイスによるプロジェクトの作成の違い

cli によって作成されたプロジェクトは、従来のノードプロジェクト構造です。プロジェクトコードは src ディレクトリにあり、コンパイラはプロジェクトにあり、コンパイル結果は dist ディレクトリにあります。
HBuilderX によって視覚的に作成されるプロジェクトは、ノードフリー開発の概念です。プロジェクトコードはプロジェクトディレクトリにあり、コンパイラはプロジェクトではなく HBuilderX ディレクトリにあり、コンパイル結果はプロジェクトのアンパッケージディレクトリにあります。

cli に慣れている開発者の中には、HBuilderX 視覚化モードの使用に不快感を感じる人もいます。それらの違いと、HBuilderX がさまざまなメソッドを提供する理由を説明します。

# cli で作成したプロジェクトを HBuilderX にドラッグして編集することもできます

まず、HBuilderX は一般的なエディターとして、従来の cli 開発と互換性があります。uni-app の cli だけでなく、他のフレームワークの cli も HBuilderX にドラッグできます。

つまり、HBuilderX では、ビジュアルインターフェイスを使用してプロジェクトを作成することも、cli コマンドラインを使用してプロジェクトを作成することもでき、uni-app との連携を向上させるという目的を達成できます。たとえば、pages.json のジャンプとプロンプト、マニフェストのビジュアルインターフェイス、条件付きコンパイル、rpx などの CSS ユニットなど、ユニアプリ向けの多くの最適化を使用できます。

これらは HBuilderX の機能であり、プロジェクトの構造とは関係ありません。

#他のIDEでユニアプリを開発したい場合は、CLIモードのみを使用できます

わかりやすいですね。他の ide には uni-app コンパイラーが組み込まれていないため、他の ide は cli によって作成されたプロジェクト形式である uni-app を開発するときにプロジェクトの下にコンパイラーをインストールすることしかできません。

cli プロジェクトはさまざまな ide を使用して開発できますが、ide 間には次のような違いがあります。

HBuilderX はユニアプリ向けに多くの最適化を行っており、他の IDE もユニアプリで使用できますが、ユニアプリ向けには最適化されていません
他の IDE には、uni-app アプリと uniCloud の実行およびデバッグツールがありません。これらのツールは HBuilderX に含まれています。アプリとuniCloudを開発するには、HBuilderXを使用する必要があります。

#可視化手法の違い

HBuilderX はプロジェクトを視覚的に作成、実行、公開します。また、基礎となる呼び出しは npm の run、build、およびその他のコマンドでもあります。コンパイラがプロジェクトの下ではなく、HBuilderX のディレクトリの下にあるだけです。

#HBuilderX 視覚化モードを提供する理由

使いやすさを向上させるために敷居を低くする

多くの開発者はノードに慣れておらず、コマンドラインに心理的な抵抗を感じています。すべての開発者がノードを知っていることを当然のことと考えないでください。HBuilder には何百万もの開発者がいますが、そのうちの半分未満がマスターノードです。

npm、github ネットワークで問題が発生することがよくあります

cli を使用してプロジェクトを作成する場合、cli は npm からインストールする必要があり、プリセットのプロジェクトテンプレートは github からダウンロードできますが、ネットワークの問題により停止することがよくあります。ビジュアル作成プロジェクトにはこの問題はありません。

各ユニアプリプロジェクトの下にコンパイラのセットを置くのは面倒すぎる

HBuilderX の開発者は多数のユニアプリプロジェクトを抱えており、プロジェクトごとにコンパイラ一式を配布すると、・プロジェクトの作成が非常に遅い・ディスク容量を占有する（ユニアプリコンパイラが複数あるので1万ファイル）・アップグレードは面倒ですし、互換性の問題もたくさんあります。cli プロジェクトのコンパイラは、HBuilderX のアップグレード後にアップグレードされず、開発者が npm コマンドを入力することによってのみアップグレードできます。HBuilderX がアップグレードされると、一部のユニアプリプロジェクトのコンパイラはアップグレードされず、一部はアップグレードされます。開発者はエラーを報告するときに混乱しやすく、DCloud もバグを DCloud に報告するときに混乱します。IDE のバージョン、コンパイラーのバージョン、Uni-App ランタイムのバージョンを一貫した状態に保つと、多くの問題が軽減されます。

HBuilderX に組み込まれたコンパイラを使用すると、開発者はプロジェクトを作成するときに自分のビジネスコードのみを気にする必要があり、プロジェクト構造はクリーンでリフレッシュされます。

すべての小さなプログラムもこれを行いますが、コンパイラは小さなプログラム開発ツール内にあり、プロジェクトを作成するときにコンパイラのセットはプロジェクトの下に置かれません (小さなプログラムも wxml などを js にコンパイルする必要があります)。

less、scss、ts、その他のコンパイラの自動インストール

cli プロジェクトを使用する場合は、npm コマンドを入力して、less、scss、ts、およびその他のコンパイラーを手動でインストールする必要があります。DCloud公式では各プリコンパイラの各バージョンとの互換性テストを行っていないため、それより低いバージョンのプリコンパイラを使用すると正常に動作しない可能性があり、自分で確認する必要があります
HBuilderX を使用してプロジェクトを視覚的に作成すると、これらのコンパイラはオンデマンドで自動的にインストールされ、DCloud はバージョンの互換性を正式にテストしました。開発者はコード内でこれらのプリコンパイル手法を使用するだけで済み、残りは HBuilderX が自動的に処理します。

視覚化がより効率的になる

HBuilderX が提供するノードフリー開発は、使いやすいだけでなく、より効率的です。

新しいプロジェクト：Ctrl+N
プロジェクトを実行します。Ctrl+R
発行項目:Ctrl+U

これは、ターミナルを起動してターミナルウィンドウにフォーカスを移動し、コマンドを入力するよりもはるかに高速です。

uni-app では、ターミナルコマンドは従来の Web 開発よりも長く、Web で実行するか、アプリで実行するか、小規模なプログラムで実行するかを選択するために、オペレーティングプラットフォームのパラメーターを入力する必要があります。

要約すれば、

ノードに慣れていて、プロジェクトごとにコンパイラーをインストールする方法を受け入れて管理でき、上記の長所と短所を理解している場合は、プロジェクトの作成に cli を選択できます。

IDE に関しては、HBuilderX を uni-app で開発した方が確実に効率的です。

他の ide に慣れている場合は、uni-app の開発が非効率であっても、他の ide を使用することもできます。ただし、少なくともアプリと uniCloud を実行およびデバッグするときは、WeChat アプレットツールを使用したデバッグと同様に、HBuilderX をオンにする必要があることに注意してください。

DCloud 内では、uni-app と HBuilderX は別のチームです。

uni-app の場合、すべての IDE を同等に扱います。ノードエコロジーと互換性があり、d.ts 構文プロンプトをサポートします。
HBuilderX にとって、uni-app は第一級市民です。HBuilderX はユニアプリに対して多くの最適化を行いました

#その他の考慮事項

cli 作成したプロジェクト、プロジェクト配下にコンパイラがインストールされます。また、HBuilderX ではアップグレードされません。コンパイラをアップグレードする必要がある場合は、「依存関係を指定されたバージョンに更新する」を参照してください。
作成したプロジェクトを HBuilderX で引き続き使用したい場合はcli、プロジェクトを HBuilderX にドラッグします。プロジェクト全体を HBuilderX にドラッグすると、コンパイル時にプロジェクトの下のコンパイラが使用されることに注意してください。src ディレクトリを HBuilderX にドラッグすると、HBuilderX インストールディレクトリのプラグインディレクトリにあるコンパイラが使用されます。
cli作成されたプロジェクトには d.ts が組み込まれており、他の通常の npm ライブラリと同様に、通常、vscode、webstormおよび d.ts をサポートし構文プロンプトを備えたその他の開発ツールで開発できます。
HBuilderX で作成されたプロジェクトには d.ts がありません。HBuilderX には組み込みのユニアプリ構文プロンプトライブラリがあります。HBuilderX で作成したプロジェクトを他のエディタで開いて d.ts を補足する必要がある場合は、最初にプロジェクトの下で実行してから npm initd.tsnpm i @dcloudio/types -Dを補足できます。
HBuilderX によって作成されたプロジェクトでも npm を使用できます。NPMサポートを参照してください。
vue や uni-app の分野における vscode などの他の開発ツールは、HBuilderX ほど効率的ではありません。詳細については、https: //ask.dcloud.net.cn/article/35451を参照してください。
アプリを公開するときも、HBuilderX を使用する必要があります。他の開発ツールはアプリを公開できませんが、H5 やさまざまな小さなプログラムを公開できます。アプリを開発する必要がある場合は、まず HBuilderX で実行し、次に他のエディタでコードを変更して保存します。コードが変更された後、携帯電話のドックに自動的に同期されます。
を使用してcliプロジェクトを作成する場合、HBuilderX プラグインリストの uni-app コンパイラがインストールされていない可能性があります
使用方法についてご質問がある場合は cli 、QR コードをスキャンしてユニアプリ WeChat 交換グループのディスカッションに参加してください。

参考：

小規模プログラムカスタムコンポーネントサポート | uni-app公式サイト