javascript - vue-cli は、異なるバックエンド インターフェイス サーバーに応じて異なるインターフェイス コードをどのように構築しますか?

Question

開発プロセス中に、npm run dev コンポーネントのインターフェイスによって呼び出されるアドレスは、次のように global global によって定義される API 変数です。

//開発環境を開きます

// global.API = '/api';

//テスト環境を開きます

// global.API = '/test';

//uat 環境を開く

// global.API = '/uat';

//実稼働環境を開きます

// global.API = '/www';

本番環境 npm run build を使用するときに、さまざまなインターフェイスに従って API を本番環境変数に自動的に変更するにはどうすればよいですか?

Answer 1

vue-cli によって生成されたコードを数日間熟考した結果、Vue は、開発 (npm run dev)、実稼働 (npm run build)、および単体テスト (npm run test) の 3 つの構成だけが必要であると考えました。 。 。

暴言終わり。

1. config/index.js，修改build里面的env ファイル名を開き、環境変数に基づいて取得します。
変更後は次のようになります。 リーリー

2.

prod.env.js复制两份，分别是uat.env.js、testing.env.jsをconfigディレクトリに置きます

3.

を次のように変更します。 リーリー dev.env.js、uat.env.js、testing.env.js、prod.env.js这四个文件，在大括号里面添加API: '"/api或uat或其他什么"'4. その後、どこからでも

を介してこの変数にアクセスできます。

process.env.API5. パッケージ化するときは、最初に環境変数を設定します。

Answer 2

https://stackoverflow.com/que...

Answer 3

https://github.com/tonyljl526...
express、vue2、webpack に基づいたこのプロジェクトのスキャフォールディングを確認できます。ニーズを達成するには、主に config/renderConfig.js を確認してください