序文
授業前の準備：HBuilder-X ソフトウェアと Google や Firefox などのブラウザがインストールされている必要があります。
公式サイト： https: //www.dcloud.io/
1. プロジェクトを作成する
「ファイル」->「新規」->「プロジェクト」をクリックします。
それから：
- 「ユニアプリ」をクリックします
- プロジェクト名を入力します
- プロジェクトパスの選択
- プロジェクト テンプレートを選択します。ここではデフォルトを選択します
- オプション Vue バージョン
- クリックしてプロジェクトを作成します
プロジェクトの作成が完了しました。デフォルトのテンプレートで作成されたプロジェクト構成は次のとおりです。
2. プロジェクトを実行する
メニュー バーの [実行] ボタンをクリックすると、次のようにさまざまな方法で実行できることがわかりました。
まずは以下の種類を紹介します。
- ブラウザにアクセスする
- 内蔵ブラウザを実行する
- アプレットシミュレータを実行する
2.1 ブラウザにアクセスする
运行到浏览器表示するブラウザをクリックして選択します。
配置web服务器プログラムが対応するブラウザを見つけられず、実行に失敗した場合は、図に示すように、ブラウザのアドレスを設定して をクリックする必要があります。
図に示すように、プロジェクトが通常どおり実行されるように、対応するブラウザー インストール起動プログラムを構成します。
ソフトウェアがインストールされている場所がわからない場合は、図に示すように、デスクトップ上でブラウザ アイコンを見つけ、クリックしてファイルの場所を開きます。
2.2 内蔵ブラウザで実行する
をクリックする运行到内置浏览器と、プラグインをダウンロードするように求めるプロンプトが表示されます。プロンプトに従ってダウンロードしてください。ダウンロード後、図に示すように、プロジェクトを再実行するだけです。
2.3 アプレットを実行する
多くのミニ プログラムの操作方法は似ていますが、WeChat ミニ プログラムを例に説明します。
微信开发者工具図に示すように、をクリックします。
WeChat 開発者ツールがインストールされていない場合は、ダウンロードしてインストールするように求められます。プロンプトに従ってダウンロードしてインストールしてください。ここではデモはありません。ダウンロードが完了すると、デフォルトですべてがインストールされます。
インストールが完了したら、配置web服务器図に示すように、ページに移動して WeChat 開発者ツールのパスを構成します。
次に、プロジェクトを再起動しましたが、図に示すように、起動がまだ失敗していることがわかりました。
WeChat 開発者ツールに移動して設定を開く必要があります。ソフトウェアを開いて右上隅の設定をクリックします。
「セキュリティ設定」をクリックして開きます服务端口。
図に示すように、再コンパイルして正常に実行されます。
3. 注意
3.1 修正コードのホットアップデート
コードを変更した後、Ctrl + S を押すとプロジェクト ファイルが保存され、プロジェクトは自動的に再コンパイルされ、ブラウザで更新すると最新のページが表示されます。
3.2 構文の説明
H5 などのタグは vue と同様に直接記述でき<div><div/>、ブラウザでは正常に表示されますが、ミニプログラムや Android では正常に表示されないため、uniapp のタグ仕様に合わせてプロジェクトを記述する必要があります。