Adds support for folders in /layouts

This commit is contained in:
FieryCod 2017-10-15 21:31:01 +02:00 committed by Sebastien Chopin
parent 10c4190732
commit c99a86d8ab
6 changed files with 84 additions and 3 deletions

View File

@ -227,10 +227,10 @@ export default class Builder extends Tapable {
// -- Layouts --
if (fs.existsSync(resolve(this.options.srcDir, 'layouts'))) {
const layoutsFiles = await glob('layouts/*.vue', { cwd: this.options.srcDir })
const layoutsFiles = await glob('layouts/**/*.vue', { cwd: this.options.srcDir })
let hasErrorLayout = false
layoutsFiles.forEach((file) => {
let name = file.split('/').slice(-1)[0].replace(/\.vue$/, '')
let name = file.split('/').slice(1).join('/').replace(/\.vue$/, '')
if (name === 'error') {
hasErrorLayout = true
return

View File

@ -0,0 +1,20 @@
<template>
<div>
<h1>Default desktop layout</h1>
<nuxt/>
</div>
</template>
<style>
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
src: local('Roboto'), local('Roboto-Regular'), url(~/assets/roboto.woff2) format('woff2');
unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}
body {
font-family: 'Roboto';
}
</style>

View File

@ -0,0 +1,21 @@
<template>
<div>
<h1>Default mobile layout</h1>
<nuxt/>
</div>
</template>
<style>
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
src: local('Roboto'), local('Roboto-Regular'), url(~/assets/roboto.woff2) format('woff2');
unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}
body {
font-family: 'Roboto';
}
</style>

View File

@ -0,0 +1,12 @@
<template>
<div>
<h1>Desktop page</h1>
</div>
</template>
<script>
export default {
layout: 'desktop/default'
}
</script>

View File

@ -0,0 +1,12 @@
<template>
<div>
<h1>Mobile page</h1>
</div>
</template>
<script>
export default {
layout: 'mobile/default'
}
</script>

View File

@ -61,6 +61,22 @@ test('/test/about (custom layout)', async t => {
t.true(html.includes('<h1>About page</h1>'))
})
test('/test/desktop (custom layout in desktop folder)', async t => {
const window = await nuxt.renderAndGetWindow(url('/test/desktop'))
const html = window.document.body.innerHTML
t.is(window.__NUXT__.layout, 'desktop/default')
t.true(html.includes('<h1>Default desktop layout</h1>'))
t.true(html.includes('<h1>Desktop page</h1>'))
})
test('/test/mobile (custom layout in mobile folder)', async t => {
const window = await nuxt.renderAndGetWindow(url('/test/mobile'))
const html = window.document.body.innerHTML
t.is(window.__NUXT__.layout, 'mobile/default')
t.true(html.includes('<h1>Default mobile layout</h1>'))
t.true(html.includes('<h1>Mobile page</h1>'))
})
test('/test/env', async t => {
const window = await nuxt.renderAndGetWindow(url('/test/env'))
const html = window.document.body.innerHTML
@ -95,7 +111,7 @@ test('/test/about-bis (added with extendRoutes)', async t => {
test('Check stats.json generated by build.analyze', t => {
const stats = require(resolve(__dirname, 'fixtures/with-config/.nuxt/dist/stats.json'))
t.is(stats.assets.length, 27)
t.is(stats.assets.length, 35)
})
test('Check /test/test.txt with custom serve-static options', async t => {