Używamy oryginalnego Vuepress (gałąź 0.x) i chcemy użyć configureWebpack metoda pliku konfiguracyjnego Vuepress do eksportu niektórych zmiennych niestandardowych.

Ten kod psuje kompilację, ponieważ pakiet Webpack nie zezwala na niestandardowe właściwości od wersji 2.0:

configureWebpack: (config) => {
  config.env = process.env
}

Błąd:

WebpackOptionsValidationError: nieprawidłowy obiekt konfiguracyjny. Pakiet Webpack został zainicjowany przy użyciu obiektu konfiguracyjnego, który nie jest zgodny ze schematem interfejsu API. - konfiguracja ma nieznaną właściwość 'env'.

Sprawdziłem również dokumentację Webpack dla definiowania wtyczek, jednak problem polega na tym, że Metoda configureWebpack w rzeczywistości nie ujawnia instancji webpack używanej przez Vuepress — bezpośrednio próbuje zmutować opcje webpack (co jest niedozwolone) — ale ponieważ instancja webpack nie jest dostępna, nie możemy po prostu zdefiniować wtyczki tak, jak tego oczekuje od nas webpack.

Czy ktoś zna właściwy sposób ujawnienia, powiedzmy, konfigurowalnych zmiennych środowiskowych, których możemy użyć w naszych komponentach Vue za pomocą Vuepress 0.x?

2
GrayedFox 7 grudzień 2018, 14:55

1 odpowiedź

Najlepsza odpowiedź

Cóż... zajęło nam trochę kłótni z potokiem kompilacji VuePress i przeskakiwanie przez obręcze Webpack, ale ponieważ VuePress korzysta z Webpack, możemy po prostu wymagać tego w naszym pliku konfiguracyjnym (założyłem metodę potrzebną do ujawnienia instancji Webpack VuePress, która nie jest poprawne).

Jeśli używasz dotenv, możesz udostępnić niestandardowe zmienne środowiskowe swoim komponentom, to działa:

// .vuepress/config.js
require('dotenv').config()
const webpack = require('webpack')

module.exports = {
  configureWebpack: (config) => {
    return { plugins: [
      new webpack.EnvironmentPlugin({ ...process.env })
    ]}
  }
}

Uwaga: zajęłoby to wszystko z pliku env i udostępniłoby je we wszystkich komponentach, ponieważ kompilacje produkcyjne wymagają tylko potrzebnych kluczy.

5
GrayedFox 10 grudzień 2018, 14:01
Robię to, ale nadal wyświetla mi się process is not defined w przeglądarce. Co mogę zrobić źle?
 – 
mspoulsen
14 wrzesień 2020, 12:37