From 6e8a51509cf82abd864e81f3768c22fb4eaa8bb9 Mon Sep 17 00:00:00 2001
From: Alexander Lichter <manniL@gmx.net>
Date: Sun, 2 Sep 2018 10:22:10 +0100
Subject: [PATCH] feat(builder, module): allow error layouts to be added
 through addLayout. closes #3194. (#3834)

---
 lib/builder/builder.js                             | 14 ++++++--------
 lib/core/module.js                                 | 10 ++++++++++
 test/fixtures/module/modules/layout/index.js       |  6 ++++++
 test/fixtures/module/modules/layout/some-error.vue |  3 +++
 test/fixtures/module/nuxt.config.js                |  1 +
 test/unit/module.test.js                           |  5 +++++
 6 files changed, 31 insertions(+), 8 deletions(-)
 create mode 100644 test/fixtures/module/modules/layout/index.js
 create mode 100644 test/fixtures/module/modules/layout/some-error.vue

diff --git a/lib/builder/builder.js b/lib/builder/builder.js
index d8e2835a01..d531c22026 100644
--- a/lib/builder/builder.js
+++ b/lib/builder/builder.js
@@ -223,7 +223,6 @@ export default class Builder {
         cwd: this.options.srcDir,
         ignore: this.options.ignore
       })
-      let hasErrorLayout = false
       layoutsFiles.forEach((file) => {
         const name = file
           .split('/')
@@ -231,7 +230,12 @@ export default class Builder {
           .join('/')
           .replace(/\.(vue|js)$/, '')
         if (name === 'error') {
-          hasErrorLayout = true
+          if (!templateVars.components.ErrorPage) {
+            templateVars.components.ErrorPage = this.relativeToBuild(
+              this.options.srcDir,
+              file
+            )
+          }
           return
         }
         if (!templateVars.layouts[name] || /\.vue$/.test(file)) {
@@ -241,12 +245,6 @@ export default class Builder {
           )
         }
       })
-      if (!templateVars.components.ErrorPage && hasErrorLayout) {
-        templateVars.components.ErrorPage = this.relativeToBuild(
-          this.options.srcDir,
-          `${this.options.dir.layouts}/error.vue`
-        )
-      }
     }
     // If no default layout, create its folder and add the default folder
     if (!templateVars.layouts.default) {
diff --git a/lib/core/module.js b/lib/core/module.js
index 5446cbae16..7d90614c63 100644
--- a/lib/core/module.js
+++ b/lib/core/module.js
@@ -71,6 +71,16 @@ export default class ModuleContainer {
 
     // Add to nuxt layouts
     this.options.layouts[name || path.parse(src).name] = `./${dst}`
+
+    // If error layout, set ErrorPage
+    if (name === 'error') {
+      this.addErrorLayout(dst)
+    }
+  }
+
+  addErrorLayout(dst) {
+    const relativeBuildDir = path.relative(this.options.rootDir, this.options.buildDir)
+    this.options.ErrorPage = `~/${relativeBuildDir}/${dst}`
   }
 
   addServerMiddleware(middleware) {
diff --git a/test/fixtures/module/modules/layout/index.js b/test/fixtures/module/modules/layout/index.js
new file mode 100644
index 0000000000..ae6b982f8d
--- /dev/null
+++ b/test/fixtures/module/modules/layout/index.js
@@ -0,0 +1,6 @@
+import { resolve } from 'path'
+
+export default function module() {
+  this.addLayout(
+    { src: resolve(__dirname, 'some-error.vue') }, 'error')
+}
diff --git a/test/fixtures/module/modules/layout/some-error.vue b/test/fixtures/module/modules/layout/some-error.vue
new file mode 100644
index 0000000000..e11cbe3f28
--- /dev/null
+++ b/test/fixtures/module/modules/layout/some-error.vue
@@ -0,0 +1,3 @@
+<template>
+  <h1>You should see the error in a different Vue!</h1>
+</template>
diff --git a/test/fixtures/module/nuxt.config.js b/test/fixtures/module/nuxt.config.js
index 07f5ab6e5a..cf3ef40c88 100644
--- a/test/fixtures/module/nuxt.config.js
+++ b/test/fixtures/module/nuxt.config.js
@@ -3,6 +3,7 @@ export default {
   modules: [
     '~~/modules/basic',
     '~/modules/hooks',
+    '~/modules/layout',
     {
       src: '~/modules/middleware',
       options: {
diff --git a/test/unit/module.test.js b/test/unit/module.test.js
index d579ad58b9..f53ff3859a 100644
--- a/test/unit/module.test.js
+++ b/test/unit/module.test.js
@@ -31,6 +31,11 @@ describe('module', () => {
     expect(html.includes('<h1>Module Layouts</h1>')).toBe(true)
   })
 
+  test('/404 should display the module error layout', async () => {
+    const { html } = await nuxt.renderRoute('/404')
+    expect(html).toContain('You should see the error in a different Vue!')
+  })
+
   test('Hooks', () => {
     expect(nuxt.__module_hook).toBe(1)
     expect(nuxt.__renderer_hook).toBe(2)