From 49e080686ad1c5e6a4b52a5ad6ae780229171484 Mon Sep 17 00:00:00 2001
From: jiezhangaofl <103002127+jiezhangaofl@users.noreply.github.com>
Date: Tue, 7 May 2024 14:23:40 -0700
Subject: [PATCH] Update config doc to include how to use env vars
---
docs/v3.x/getting-started/configuration.md | 19 ++++++++++++++++++-
1 file changed, 18 insertions(+), 1 deletion(-)
diff --git a/docs/v3.x/getting-started/configuration.md b/docs/v3.x/getting-started/configuration.md
index 433971a72..ed70f836e 100644
--- a/docs/v3.x/getting-started/configuration.md
+++ b/docs/v3.x/getting-started/configuration.md
@@ -217,6 +217,23 @@ build: {
extend: () => {} // can be used to modify webpack config
}
```
+---
+If you want to load env files to your code depend on the environment, you could take advantage of the extend config here. Under `build.extend`, you can add your own plugins by doing something like this
+```
+extend: {
+ plugins: [
+ new webpack.DefinePlugin({
+ 'process.env': JSON.stringify(envVars)
+ })
+ ]
+ }
+```
+You can grab the envVars dynamically from the file depends on the `NODE_ENV`. For example, if you are using dotenv package:
+```
+const nodeEnv = process.env.NODE_ENV || 'development';
+const dotenv = require('dotenv')
+const envVars = dotenv.parse(fs.readFileSync(`.env.${env}`));
+```
---
## devServer
@@ -268,4 +285,4 @@ unitTesting: {
]
}
```
-*Note - these settings correspond to v3.5+ refer to v2 documentation for earlier versions*
\ No newline at end of file
+*Note - these settings correspond to v3.5+ refer to v2 documentation for earlier versions*