diff --git a/docs/config/README.md b/docs/config/README.md
index 3f42cd58d1..1565534886 100644
--- a/docs/config/README.md
+++ b/docs/config/README.md
@@ -80,6 +80,13 @@ module.exports = {
   `assetsDir` is ignored when overwriting the filename or chunkFilename from the generated assets.
   :::
 
+### environmentsDir
+
+- Type: `string`
+- Default: `''`
+
+  A directory where environment files will be loaded  
+
 ### indexPath
 
 - Type: `string`
diff --git a/docs/guide/mode-and-env.md b/docs/guide/mode-and-env.md
index 47c1bbfdf9..7eb934c5d2 100644
--- a/docs/guide/mode-and-env.md
+++ b/docs/guide/mode-and-env.md
@@ -1,6 +1,6 @@
 # Environment Variables and Modes
 
-You can specify env variables by placing the following files in your project root:
+You can specify env variables by placing the following files in your project root or customize it using `environmentsDir` option in `vue.config.js`:
 
 ``` bash
 .env                # loaded in all cases
diff --git a/packages/@vue/cli-service/lib/Service.js b/packages/@vue/cli-service/lib/Service.js
index 668a65d631..b73260e6b7 100644
--- a/packages/@vue/cli-service/lib/Service.js
+++ b/packages/@vue/cli-service/lib/Service.js
@@ -61,6 +61,10 @@ module.exports = class Service {
     this.initialized = true
     this.mode = mode
 
+    // load user config
+    const userOptions = this.loadUserOptions()
+    this.projectOptions = defaultsDeep(userOptions, defaults())
+
     // load mode .env
     if (mode) {
       this.loadEnv(mode)
@@ -68,10 +72,6 @@ module.exports = class Service {
     // load base .env
     this.loadEnv()
 
-    // load user config
-    const userOptions = this.loadUserOptions()
-    this.projectOptions = defaultsDeep(userOptions, defaults())
-
     debug('vue:project-config')(this.projectOptions)
 
     // apply plugins.
@@ -90,7 +90,9 @@ module.exports = class Service {
 
   loadEnv (mode) {
     const logger = debug('vue:env')
-    const basePath = path.resolve(this.context, `.env${mode ? `.${mode}` : ``}`)
+    const baseDir = this.projectOptions
+      ? path.posix.join(this.context, this.projectOptions.environmentsDir) : this.context
+    const basePath = path.resolve(baseDir, `.env${mode ? `.${mode}` : ``}`)
     const localPath = `${basePath}.local`
 
     const load = path => {
diff --git a/packages/@vue/cli-service/lib/options.js b/packages/@vue/cli-service/lib/options.js
index 7dc1f84ba6..c1f663a896 100644
--- a/packages/@vue/cli-service/lib/options.js
+++ b/packages/@vue/cli-service/lib/options.js
@@ -4,6 +4,7 @@ const schema = createSchema(joi => joi.object({
   baseUrl: joi.string().allow(''),
   outputDir: joi.string(),
   assetsDir: joi.string().allow(''),
+  environmentsDir: joi.string().allow(''),
   indexPath: joi.string(),
   filenameHashing: joi.boolean(),
   runtimeCompiler: joi.boolean(),
@@ -71,6 +72,9 @@ exports.defaults = () => ({
   // where to put static assets (js/css/img/font/...)
   assetsDir: '',
 
+  // where to load environments
+  environmentsDir: '',
+
   // filename for index.html (relative to outputDir)
   indexPath: 'index.html',
 
diff --git a/packages/@vue/cli-ui/locales/en.json b/packages/@vue/cli-ui/locales/en.json
index e50ca202d9..3c9e3b63ab 100644
--- a/packages/@vue/cli-ui/locales/en.json
+++ b/packages/@vue/cli-ui/locales/en.json
@@ -591,6 +591,10 @@
               "label": "Assets directory",
               "description": "A directory to nest generated static assets (js, css, img, fonts) under."
             },
+            "environmentsDir": {
+              "label": "Environments directory",
+              "description": "The directory where the environment files will be loaded"
+            },
             "runtimeCompiler": {
               "label": "Enable runtime compiler",
               "description": "This will allow you to use the template option in Vue components, but will incur around an extra 10kb payload for your app."
diff --git a/packages/@vue/cli-ui/ui-defaults/config.js b/packages/@vue/cli-ui/ui-defaults/config.js
index 6496138660..1991257783 100644
--- a/packages/@vue/cli-ui/ui-defaults/config.js
+++ b/packages/@vue/cli-ui/ui-defaults/config.js
@@ -43,6 +43,16 @@ module.exports = api => {
           group: 'org.vue.vue-webpack.config.vue-cli.groups.general',
           link: 'https://cli.vuejs.org/config/#assetsdir'
         },
+        {
+          name: 'environmentsDir',
+          type: 'input',
+          default: '',
+          value: data.vue && data.vue.environmentsDir,
+          message: 'org.vue.vue-webpack.config.vue-cli.environmentsDir.label',
+          description: 'org.vue.vue-webpack.config.vue-cli.environmentsDir.description',
+          group: 'org.vue.vue-webpack.config.vue-cli.groups.general',
+          link: 'https://cli.vuejs.org/config/#environmentsdir'
+        },
         {
           name: 'runtimeCompiler',
           type: 'confirm',