使用.envファイルを容易に構成し、サーバーの開発と環境の公式をデバッグすることができ、APIインターフェイスをアクセスするために、前後にパスのニーズを切り替えることなく、コードを達成するために、構成ファイルの2つの異なるセットを使用して本番環境を導入しました。
公式ドキュメント
https://cli.vuejs.org/zh/guide/mode-and-env.html
ファイルを作成します.env
VUEプロジェクトのルートディレクトリに作成された.env.developmentと.env.production2つのテキストファイルの開発環境と本番環境で使用されています
.env.development次のようにドキュメントを読み取ります。
VUE_APP_API_HOST=127.0.0.1
.env.production次のようにドキュメントを読み取ります。
VUE_APP_API_HOST=10.41.56.121
ことを注意.env変数名がでなければなりませんVUE_APP_初め
変数アクセス.env
例えば、でmain.js構成axios要求ルートのように書くことができます。
axios.defaults.baseURL = `http://${process.env.VUE_APP_API_HOST}:8000/`
フォーマットされた文字列の構文ES6は、フロントとして、あることに注意してください~、キー入力シンボル`
このように、ローカルでの使用は、yarn serveアクセスにテストサーバー上で実行される.env.development定義された変数、およびにyarn build時間使用する.env.production変数の内容を。
サイド物語
この好奇心~のキー入力反单引号（私は呼び出しません）Jiaosha名は、外国人がそれを呼びたいことを発見しGrave accent、それが翻訳と呼ばれるべき重音符
