vueプロジェクトはHbuilderを利用してAPPの流れに包装して、そして出会った穴を話します。


1.包装項目
その間にあった穴は、前もって言ってください。仕事を繰り返さないようにしてください。
1.1包装のアプリに白スクリーンが現れます。
発生原因:経路が間違っています。config\index.jsを変更する必要があります。
包装の経路を変更します。

1.2ページをクリックしてもジャンプできません。Loading chunk 2 failed.などのエラーを報告します。
原因があります。historyでルートを設定できません。hashを使います。
解決方法:ルートのmode属性を修正するのはhashです。

1.3.携帯の物理ボタンを押して、直接にプログラムを終了します。
無理なリターンキーは直接にルートが聞こえなくなり、そのままプログラムを終了します。
解決方法:ムーイを導入して正常に使うことができます。
1.webpack.base.com nf.jsにmuiを導入する。図1)
2.mbi関連ファイルをダウンロードして、main.jsに導入する(ムイの他の方法が必要なら、自分で資料を調べてください。
3.この時、muiを導入すると誤報があるかもしれません。私たちはいくつかの書類を修正しなければなりません。図3)

(図一)

(図二)

(図二)


(図三)
2.Hbuilderのリリース
2.1プロジェクト5+Appプロジェクトを作成する

2.2置換ファイル
デフォルトのcss、img、js、index.などの不要なデフォルトファイルを削除します。包装したdistフォルダの下のstaticとindex.ファイルを新しいプロジェクトの下に置きます。
関連アプリの構成は自分でmaifest.jsonで修正できます。ここでは詳しく説明しません。

2.3クラウドパッケージを利用してAPPを発表する
証明書があれば、証明書などの情報を記入し、Dcloud公用証明書を一時的に使用することができます。
情報を記入し終わったら、パッケージをクリックしてから、パッケージを作ってアプリのダウンロードリンクを作成するのを待って、ダウンロードしてインストールします。


個人記録~
知識を補充します:vueプロジェクトを記録して包んでhbuilderに入れてapp真機のテストをする時バックグラウンドのサービスインターフェースを要求することができません。
1.アプリをリリースする時、vue開発モードで設定したクロスドメインは無効です。包装したらインターフェースが見つからないからです。
例えば以下は前のエラー版です。

'/propertyCmsAPI': {
    target: 'http://192.168.1.111:9001/',
    changeOrigin: true,
    pathRewrite: {
     '^/propertyCmsAPI':''
    }
   },
使用中:
export const logout=params=>{return axios.post(`/propertyCms API/not Intercept/logout`,params)}
この方法はホームページの端で包装するのに問題がないので、nginxの中に配置してドメインをまたぐだけで訪問できます。
しかし、appを作る時、このようにデータにアクセスできないです。ドメインをまたぐという言い方がないので、appに包装してから実際にアクセスするルートは/propertyCmsAPI/not Intercept/logoutです。このようにすれば、インターフェースが見つからないです。絶対パスを採用します。
たとえば:http://192.168.1.111:9001/notIntercept/logoutこのようにしてこそアクセスできます。いくらあなたの要求を管理するアプリを配置しても、これは必須です。
以下は私が変更した後のやり方が正しい版で、完全に適用されます。
let propertyCms API="http://112.74.126.167:9001";パッケージアプリの場合に使用します
//let propertyCms API=「propertyCms API」
開発モードとパッケージモードに分けて、全ての要求アプリを一括管理する:

他にもっといい方法があるはずです。研究を怠りました。目的はすでに達成しました。効果はすでに実現しました。
これは全部できたら包装して、Hbuilderエディタに入れてオンラインテストをします。
2.オンラインテスト:
安卓機、香りがいいです
1.あなたの携帯電話をUSBでパソコンに接続するだけで、2.携帯電話の開発者モードを開いて、3.USBを選んでファイルを転送できます。4.USBモードを開いて、5.パソコンがこの携帯電話にアクセスできることを確認します。
hbuilderの運行の中であなたの携帯電話を探し当ててクリックして運行するのでさえすれば、携帯電話でテストアプリをインストールすることができて、続いてテストすることができて、とても力強いです。
アップルマシン、本当に臭いです
携帯のパソコンとアップルの携帯は何が必要ですか?老子はこれをインストールするだけで、一時間ぐらいでパソコンを携帯につないでいます。
hbuilderの実行中にiPhoneを見つけてクリックして実行したら、テストアプリをインストールして、設定-ユニバーサルでこのアプリを管理してください。信頼を選択しなければいけません。でないと、あなたのテストアプリは開けられません。
appを開けた後に、最も卵を使うことは彼のまたのがインターフェースにアクセスできないので、コンソールはスクリーンショットの要求情報を印刷して、情報に応答して、クリックして要求した後に直接catchに入って、まったく要求を実行しないで、誤ったヒントは1つのnewwork errorについて、この問題について午後整えました。
各種の検索、百度、hbuilder公式サイトが提供する問題解決の方法を含んで、もとのvueプロジェクトの中でまたqsを導入するので、またes 6-prmseを導入して、そして卵。
最後の最後にプロジェクトのmanife.json配置に配置を追加しました。plusの下にあります。

"kernel":{
 "ios":"UIWebview"
},
専門アプリの開発ではなく、わからない、問題解決、ログを記録します。
以上の浅談VueプロジェクトはHbuilderを利用してAPPプロセスに包装しました。そして出会った穴は小編集で皆さんに共有した内容です。参考にしてほしいです。皆さんも多くの支援をお願いします。