nuxt.js Konfiguration mehrerer Umgebungsvariablen

1. Einleitung

Im Allgemeinen gibt es in unserer Projektentwicklung normalerweise die folgenden drei Umgebungen

• Die Entwicklungsumgebung wird auch test genannt (Test)
• RC Umgebung wird auch als Pre-Release-Umgebung ( rc ) bezeichnet.
• production

2. Szenario

Dann gibt es eine Situation, in der wir verschiedene api Schnittstellen in verschiedenen Umgebungen unterscheiden müssen, zum Beispiel

• Testumgebung (test) api=test.ydhtml.com

• Vorabversionsumgebung ( rc) api=rc.ydhtml.com

• Online-Umgebung (production) api=ydhtml.com

3. Schaffen Sie eine Umgebung

Als nächstes erstellen wir die Datei env.js im Stammverzeichnis des Projekts mit folgendem Inhalt

modul.exporte = {
    prüfen: {
        MODUS: 'Test'
    },
    rc: {
        MODUS: 'rc',
    },
    Produkt: {
        MODUS: 'prod',
    }
}

Nachdem wir die entsprechende Umgebung konfiguriert haben, fügen wir den scripts unter package.json Verpackungsbefehle hinzu.

wie folgt:

"build:test": "umgebungsübergreifender Modus = Nuxt-Build testen",
"build:rc": "umgebungsübergreifender MODUS=rc nuxt build",
"build:prod": "umgebungsübergreifender Modus = prod nuxt build",

3.1 Einfügen von Umgebungsvariablen

Öffnen Sie die Datei nuxt.config.js und fügen Sie den folgenden Code hinzu

const env = erfordern('./env')
modul.exporte = {
    Umgebung: {
        NUXT_ENV: env[Prozess.Umgebung.MODE]
    }
}

4. Abschließend

Schließlich verwenden wir es auf der Seite. Der Code lautet wie folgt:

const api = {
    Produkt: "http://ydhtml.com",
    Test: "http://test-ydhtml.com",
    rc: "http://rc-ydhtml.com"
}

const baseURL = api[Prozess.Umgebung.NUXT_ENV.MODE]

Dies ist das Ende dieses Artikels über die Konfiguration von Variablen für mehrere Umgebungen in nuxt.js. Weitere verwandte Inhalte zur Konfiguration von Variablen für mehrere Umgebungen in nuxt.js finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!