feat: added default page when no pages/ directory

This commit is contained in:
Ricardo Gobbo de Souza 2018-04-06 08:27:43 -03:00
parent ba4aa6dc09
commit c57a093901
3 changed files with 180 additions and 16 deletions

162
lib/app/pages/index.vue Normal file
View File

@ -0,0 +1,162 @@
<template>
<div>
<section class="Landscape">
<div class="Landscape__Logo">
<div class="VueToNuxtLogo">
<div class="Triangle Triangle--two"></div>
<div class="Triangle Triangle--one"></div>
<div class="Triangle Triangle--three"></div>
<div class="Triangle Triangle--four"></div>
</div>
<h1 class="Landscape__Logo__Title">NUXT</h1>
</div>
<h2 class="Landscape__Title">Universal Vue.js Applications</h2>
<a href="https://nuxtjs.org/guide/installation#starting-from-scratch" target="_blank" class="button">
Get Started
</a>
</section>
</div>
</template>
<style>
.Landscape {
min-height: calc(100vh - 50px);
background-color: #fff;
padding: 70px 15px;
padding-top: 100px;
text-align: center;
}
@media (min-width: 992px) {
.Landscape {
padding: 140px 30px;
padding-top: 200px;
}
}
.Landscape__Logo__Title {
margin:0;
padding:0;
font-family: "Quicksand", "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
line-height: 20px;
display: block;
font-weight: 300;
font-size: 100px;
color: #35495e;
letter-spacing: 1px;
padding: 25px 15px;
}
@media (min-width: 992px) {
.Landscape__Logo__Title {
font-size: 120px;
display: inline-block;
padding: 0;
padding-left: 30px;
}
}
.Landscape__Title {
font-family: "Quicksand", "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
font-size: 45px;
font-weight: 300;
line-height: normal;
margin: 30px 0;
color: #526488;
word-spacing: 5px;
}
@media (min-width: 992px) {
.Landscape__Title {
font-size: 60px;
}
}
.VueToNuxtLogo {
display: inline-block;
animation: turn 2s linear forwards;
transform: rotateX(180deg);
position: relative;
overflow: hidden;
height: 180px;
width: 245px;
}
.Triangle {
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
}
.Triangle--one {
border-left: 105px solid transparent;
border-right: 105px solid transparent;
border-bottom: 180px solid #41B883;
}
.Triangle--two {
top: 30px;
left: 35px;
animation: goright 0.5s linear forwards 2.5s;
border-left: 87.5px solid transparent;
border-right: 87.5px solid transparent;
border-bottom: 150px solid #3B8070;
}
.Triangle--three {
top: 60px;
left: 35px;
animation: goright 0.5s linear forwards 2.5s;
border-left: 70px solid transparent;
border-right: 70px solid transparent;
border-bottom: 120px solid #35495E;
}
.Triangle--four {
top: 120px;
left: 70px;
animation: godown 0.5s linear forwards 2s;
border-left: 35px solid transparent;
border-right: 35px solid transparent;
border-bottom: 60px solid #fff;
}
@keyframes turn {
100% {
transform: rotateX(0deg);
}
}
@keyframes godown {
100% {
top: 180px;
}
}
@keyframes goright {
100% {
left: 70px;
}
}
.button {
font-family: "Quicksand", "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
position: relative;
display: inline-block;
color: #fff!important;
font-size: 16px;
font-weight: 600;
padding: 14px 42px;
padding-top: 13px;
min-width: 150px;
text-align: center;
text-transform: uppercase;
text-decoration: none;
background-color: #3b8070;
border-radius: 4px;
letter-spacing: 1px;
border: 1px solid #3b8070;
}
</style>

View File

@ -119,9 +119,7 @@ export default class Builder {
`No \`${this.options.dir.pages}\` directory found in ${dir}. Did you mean to run \`nuxt\` in the parent (\`../\`) directory?`
)
} else {
throw new Error(
`Couldn't find a \`${this.options.dir.pages}\` directory in ${dir}. Please create one under the project root`
)
this._defaultPage = true
}
}
}
@ -249,8 +247,13 @@ export default class Builder {
// -- Routes --
consola.debug('Generating routes...')
// If user defined a custom method to create routes
if (this._nuxtPages) {
if (this._defaultPage) {
templateVars.router.routes = createRoutes(
['index.vue'],
this.options.nuxtAppDir + '/pages'
)
} else if (this._nuxtPages) { // If user defined a custom method to create routes
// Use nuxt.js createRoutes bases on pages/
const files = {}
;(await glob(`${this.options.dir.pages}/**/*.{vue,js}`, {

View File

@ -1,5 +1,5 @@
import { resolve } from 'path'
import { loadFixture, Nuxt, Builder } from '../utils'
import { loadFixture, getPort, Nuxt, Builder } from '../utils'
describe('nuxt', () => {
test('Nuxt.js Class', () => {
@ -32,16 +32,15 @@ describe('nuxt', () => {
})
})
test('Fail to build when no pages/ directory', () => {
const nuxt = new Nuxt({
dev: false,
rootDir: resolve(__dirname)
})
test('Build with default page when no pages/ directory', async () => {
const nuxt = new Nuxt()
new Builder(nuxt).build()
const port = await getPort()
await nuxt.listen(port, 'localhost')
return new Builder(nuxt).build().catch(err => {
let s = String(err)
expect(s.includes("Couldn't find a `pages` directory")).toBe(true)
expect(s.includes('Please create one under the project root')).toBe(true)
})
const { html } = await nuxt.renderRoute('/')
expect(html.includes('Universal Vue.js Applications')).toBe(true)
await nuxt.close()
})
})