refactor: use eslint-plugin-vue instead of eslint-plugin-html (#3517)

This commit is contained in:
Clark Du 2018-07-12 13:03:50 +01:00 committed by Sébastien Chopin
parent d31aeaad6c
commit 2b5c367efa
97 changed files with 445 additions and 418 deletions

View File

@ -1,7 +1,7 @@
module.exports = {
root: true,
parser: 'babel-eslint',
parserOptions: {
parser: 'babel-eslint',
sourceType: 'module'
},
env: {
@ -13,10 +13,11 @@ module.exports = {
'standard',
'standard-jsx',
'plugin:import/errors',
'plugin:import/warnings'
'plugin:import/warnings',
"plugin:vue/recommended"
],
plugins: [
'html',
'vue',
'jest'
],
settings: {
@ -48,13 +49,16 @@ module.exports = {
// Do not allow console.logs etc...
'no-console': 2,
'space-before-function-paren': [
2,
{
anonymous: 'always',
named: 'never'
}
],
'space-before-function-paren': [2, {
anonymous: 'always',
named: 'never'
}],
'vue/no-parsing-error': [2, {
'x-invalid-end-tag': false
}],
"vue/max-attributes-per-line": [2, {
"singleline": 5,
}]
},
globals: {}

View File

@ -12,4 +12,3 @@
</div>
</div>
</template>

View File

@ -1,8 +1,8 @@
<template>
<ul>
<li v-for="(post, index) in posts" :key="index">
<h3>{{ post.date }}</h3>
<h2><nuxt-link :to="post.link">{{ post.title }}</nuxt-link></h2>
<h3>{{ post.date }}</h3>
<h2><nuxt-link :to="post.link">{{ post.title }}</nuxt-link></h2>
</li>
<li style="border:none;text-align: center;font-size: 14px;">Design from <a href="http://blog.evanyou.me" target="_blank">EvanYou.me</a></li>
</ul>

View File

@ -10,7 +10,7 @@
<ul>
<li>Vue.js</li>
<li>Nuxt.js</li>
<li>= <3</li>
<li>= &lt;3</li>
</ul>
</div>
</div>

View File

@ -2,10 +2,10 @@
<div class="container">
<h1>Please login to see the secret content</h1>
<form v-if="!$store.state.authUser" @submit.prevent="login">
<p class="error" v-if="formError">{{ formError }}</p>
<p v-if="formError" class="error">{{ formError }}</p>
<p><i>To login, use <b>demo</b> as username and <b>demo</b> as password.</i></p>
<p>Username: <input type="text" v-model="formUsername" name="username" /></p>
<p>Password: <input type="password" v-model="formPassword" name="password" /></p>
<p>Username: <input v-model="formUsername" type="text" name="username" ></p>
<p>Password: <input v-model="formPassword" type="password" name="password" ></p>
<button type="submit">Login</button>
</form>
<div v-else>

View File

@ -1,7 +1,7 @@
<template>
<div>
<h1>Dog</h1>
<img :src="dog" />
<img :src="dog" >
</div>
</template>

View File

@ -8,7 +8,7 @@
<script>
export default {
name: 'date',
name: 'Date',
serverCacheKey() {
// Will change every 10 secondes
return Math.floor(Date.now() / 10000)

View File

@ -1,9 +1,9 @@
<template>
<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 class="Triangle Triangle--two"/>
<div class="Triangle Triangle--one"/>
<div class="Triangle Triangle--three"/>
<div class="Triangle Triangle--four"/>
</div>
</template>

View File

@ -1,6 +1,6 @@
<template>
<div class="container">
<p><img src="~/assets/nuxt.png" /></p>
<p><img src="~/assets/nuxt.png" ></p>
<p>This image is included as data:image/png;base64...</p>
<p>In the source code, the files generated are based on the build.filenames data.</p>
</div>

View File

@ -1,6 +1,6 @@
<template>
<div>
<img src="logo.png"/>
<img src="logo.png">
<nuxt/>
</div>
</template>

View File

@ -8,7 +8,12 @@
<script>
export default {
props: ['error']
props: {
error: {
type: Object,
default: null
}
}
}
</script>

View File

@ -1,5 +1,5 @@
<template>
<div class="loading-page" v-if="loading">
<div v-if="loading" class="loading-page">
<p>Loading...</p>
</div>
</template>

View File

@ -5,7 +5,10 @@
<script>
export default {
props: {
data: String
data: {
type: String,
default: ''
}
}
}
</script>
@ -17,4 +20,4 @@ pre {
margin: 0;
padding: 20px;
}
</style>
</style>

View File

@ -1,14 +1,36 @@
<template>
<div>
<img v-if="loaded" :src="data" alt="image" />
<svg v-else width="60px" height="60px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="uil-ring"><rect x="0" y="0" width="100" height="100" fill="none" class="bk"></rect><defs><filter id="uil-ring-shadow" x="-100%" y="-100%" width="300%" height="300%"><feOffset result="offOut" in="SourceGraphic" dx="0" dy="0"></feOffset><feGaussianBlur result="blurOut" in="offOut" stdDeviation="0"></feGaussianBlur><feBlend in="SourceGraphic" in2="blurOut" mode="normal"></feBlend></filter></defs><path d="M10,50c0,0,0,0.5,0.1,1.4c0,0.5,0.1,1,0.2,1.7c0,0.3,0.1,0.7,0.1,1.1c0.1,0.4,0.1,0.8,0.2,1.2c0.2,0.8,0.3,1.8,0.5,2.8 c0.3,1,0.6,2.1,0.9,3.2c0.3,1.1,0.9,2.3,1.4,3.5c0.5,1.2,1.2,2.4,1.8,3.7c0.3,0.6,0.8,1.2,1.2,1.9c0.4,0.6,0.8,1.3,1.3,1.9 c1,1.2,1.9,2.6,3.1,3.7c2.2,2.5,5,4.7,7.9,6.7c3,2,6.5,3.4,10.1,4.6c3.6,1.1,7.5,1.5,11.2,1.6c4-0.1,7.7-0.6,11.3-1.6 c3.6-1.2,7-2.6,10-4.6c3-2,5.8-4.2,7.9-6.7c1.2-1.2,2.1-2.5,3.1-3.7c0.5-0.6,0.9-1.3,1.3-1.9c0.4-0.6,0.8-1.3,1.2-1.9 c0.6-1.3,1.3-2.5,1.8-3.7c0.5-1.2,1-2.4,1.4-3.5c0.3-1.1,0.6-2.2,0.9-3.2c0.2-1,0.4-1.9,0.5-2.8c0.1-0.4,0.1-0.8,0.2-1.2 c0-0.4,0.1-0.7,0.1-1.1c0.1-0.7,0.1-1.2,0.2-1.7C90,50.5,90,50,90,50s0,0.5,0,1.4c0,0.5,0,1,0,1.7c0,0.3,0,0.7,0,1.1 c0,0.4-0.1,0.8-0.1,1.2c-0.1,0.9-0.2,1.8-0.4,2.8c-0.2,1-0.5,2.1-0.7,3.3c-0.3,1.2-0.8,2.4-1.2,3.7c-0.2,0.7-0.5,1.3-0.8,1.9 c-0.3,0.7-0.6,1.3-0.9,2c-0.3,0.7-0.7,1.3-1.1,2c-0.4,0.7-0.7,1.4-1.2,2c-1,1.3-1.9,2.7-3.1,4c-2.2,2.7-5,5-8.1,7.1 c-0.8,0.5-1.6,1-2.4,1.5c-0.8,0.5-1.7,0.9-2.6,1.3L66,87.7l-1.4,0.5c-0.9,0.3-1.8,0.7-2.8,1c-3.8,1.1-7.9,1.7-11.8,1.8L47,90.8 c-1,0-2-0.2-3-0.3l-1.5-0.2l-0.7-0.1L41.1,90c-1-0.3-1.9-0.5-2.9-0.7c-0.9-0.3-1.9-0.7-2.8-1L34,87.7l-1.3-0.6 c-0.9-0.4-1.8-0.8-2.6-1.3c-0.8-0.5-1.6-1-2.4-1.5c-3.1-2.1-5.9-4.5-8.1-7.1c-1.2-1.2-2.1-2.7-3.1-4c-0.5-0.6-0.8-1.4-1.2-2 c-0.4-0.7-0.8-1.3-1.1-2c-0.3-0.7-0.6-1.3-0.9-2c-0.3-0.7-0.6-1.3-0.8-1.9c-0.4-1.3-0.9-2.5-1.2-3.7c-0.3-1.2-0.5-2.3-0.7-3.3 c-0.2-1-0.3-2-0.4-2.8c-0.1-0.4-0.1-0.8-0.1-1.2c0-0.4,0-0.7,0-1.1c0-0.7,0-1.2,0-1.7C10,50.5,10,50,10,50z" fill="#59ebff" filter="url(#uil-ring-shadow)"><animateTransform attributeName="transform" type="rotate" from="0 50 50" to="360 50 50" repeatCount="indefinite" dur="1s"></animateTransform></path></svg>
<img v-if="loaded" :src="data" alt="image" >
<svg
v-else
width="60px"
height="60px"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 100 100"
preserveAspectRatio="xMidYMid"
class="uil-ring"><rect
x="0"
y="0"
width="100"
height="100"
fill="none"
class="bk"/><defs><filter id="uil-ring-shadow" x="-100%" y="-100%" width="300%" height="300%"><feOffset result="offOut" in="SourceGraphic" dx="0" dy="0"/><feGaussianBlur result="blurOut" in="offOut" stdDeviation="0"/><feBlend in="SourceGraphic" in2="blurOut" mode="normal"/></filter></defs><path d="M10,50c0,0,0,0.5,0.1,1.4c0,0.5,0.1,1,0.2,1.7c0,0.3,0.1,0.7,0.1,1.1c0.1,0.4,0.1,0.8,0.2,1.2c0.2,0.8,0.3,1.8,0.5,2.8 c0.3,1,0.6,2.1,0.9,3.2c0.3,1.1,0.9,2.3,1.4,3.5c0.5,1.2,1.2,2.4,1.8,3.7c0.3,0.6,0.8,1.2,1.2,1.9c0.4,0.6,0.8,1.3,1.3,1.9 c1,1.2,1.9,2.6,3.1,3.7c2.2,2.5,5,4.7,7.9,6.7c3,2,6.5,3.4,10.1,4.6c3.6,1.1,7.5,1.5,11.2,1.6c4-0.1,7.7-0.6,11.3-1.6 c3.6-1.2,7-2.6,10-4.6c3-2,5.8-4.2,7.9-6.7c1.2-1.2,2.1-2.5,3.1-3.7c0.5-0.6,0.9-1.3,1.3-1.9c0.4-0.6,0.8-1.3,1.2-1.9 c0.6-1.3,1.3-2.5,1.8-3.7c0.5-1.2,1-2.4,1.4-3.5c0.3-1.1,0.6-2.2,0.9-3.2c0.2-1,0.4-1.9,0.5-2.8c0.1-0.4,0.1-0.8,0.2-1.2 c0-0.4,0.1-0.7,0.1-1.1c0.1-0.7,0.1-1.2,0.2-1.7C90,50.5,90,50,90,50s0,0.5,0,1.4c0,0.5,0,1,0,1.7c0,0.3,0,0.7,0,1.1 c0,0.4-0.1,0.8-0.1,1.2c-0.1,0.9-0.2,1.8-0.4,2.8c-0.2,1-0.5,2.1-0.7,3.3c-0.3,1.2-0.8,2.4-1.2,3.7c-0.2,0.7-0.5,1.3-0.8,1.9 c-0.3,0.7-0.6,1.3-0.9,2c-0.3,0.7-0.7,1.3-1.1,2c-0.4,0.7-0.7,1.4-1.2,2c-1,1.3-1.9,2.7-3.1,4c-2.2,2.7-5,5-8.1,7.1 c-0.8,0.5-1.6,1-2.4,1.5c-0.8,0.5-1.7,0.9-2.6,1.3L66,87.7l-1.4,0.5c-0.9,0.3-1.8,0.7-2.8,1c-3.8,1.1-7.9,1.7-11.8,1.8L47,90.8 c-1,0-2-0.2-3-0.3l-1.5-0.2l-0.7-0.1L41.1,90c-1-0.3-1.9-0.5-2.9-0.7c-0.9-0.3-1.9-0.7-2.8-1L34,87.7l-1.3-0.6 c-0.9-0.4-1.8-0.8-2.6-1.3c-0.8-0.5-1.6-1-2.4-1.5c-3.1-2.1-5.9-4.5-8.1-7.1c-1.2-1.2-2.1-2.7-3.1-4c-0.5-0.6-0.8-1.4-1.2-2 c-0.4-0.7-0.8-1.3-1.1-2c-0.3-0.7-0.6-1.3-0.9-2c-0.3-0.7-0.6-1.3-0.8-1.9c-0.4-1.3-0.9-2.5-1.2-3.7c-0.3-1.2-0.5-2.3-0.7-3.3 c-0.2-1-0.3-2-0.4-2.8c-0.1-0.4-0.1-0.8-0.1-1.2c0-0.4,0-0.7,0-1.1c0-0.7,0-1.2,0-1.7C10,50.5,10,50,10,50z" fill="#59ebff" filter="url(#uil-ring-shadow)"><animateTransform
attributeName="transform"
type="rotate"
from="0 50 50"
to="360 50 50"
repeatCount="indefinite"
dur="1s"/></path></svg>
</div>
</template>
<script>
export default {
props: {
data: String
data: {
type: String,
default: ''
}
},
data: () => ({
loaded: false
@ -35,4 +57,4 @@ svg {
position: relative;
left: -30px;
}
</style>
</style>

View File

@ -1,11 +1,14 @@
<template>
<p v-html="data"></p>
<p v-html="data"/>
</template>
<script>
export default {
props: {
data: String
data: {
type: String,
default: ''
}
}
}
</script>
@ -14,4 +17,4 @@ export default {
p {
padding: 5px 20px;
}
</style>
</style>

View File

@ -3,7 +3,7 @@
<h1>Nuxt Chat</h1>
<transition-group name="list" tag="ul">
<li v-for="(message, index) in messages" :key="index">
<component :is="message.component" :data="message.data"></component>
<component :is="message.component" :data="message.data"/>
</li>
</transition-group>
</div>
@ -20,6 +20,7 @@ const components = {
}
export default {
components,
data: () => ({
messages: []
}),
@ -31,8 +32,7 @@ export default {
// Add the message to the list
this.messages.push(message)
})
},
components
}
}
</script>

View File

@ -3,7 +3,7 @@
<h1>Nuxt Chat</h1>
<transition-group name="list" tag="ul">
<li v-for="(message, index) in messages" :key="index">
<component :is="message.component" :data="message.data"></component>
<component :is="message.component" :data="message.data"/>
</li>
</transition-group>
</div>
@ -21,10 +21,10 @@ const components = {
}
export default {
components,
data: () => ({
messages
}),
components
})
}
</script>
@ -60,4 +60,4 @@ ul li {
opacity: 0;
transform: translateY(20px);
}
</style>
</style>

View File

@ -9,7 +9,12 @@
<script>
export default {
layout: ({ isMobile }) => isMobile ? 'mobile' : 'default',
props: ['error']
props: {
error: {
type: Object,
default: null
}
}
}
</script>

View File

@ -4,16 +4,16 @@
<div class="container">
<h1 class="Header__Title">Nuxt i18n</h1>
<nav class="Header__Menu">
<nuxt-link class="Header__Link" :to="$i18n.path('')" exact>
<nuxt-link :to="$i18n.path('')" class="Header__Link" exact>
{{ $t('links.home') }}
</nuxt-link>
<nuxt-link class="Header__Link" :to="$i18n.path('about')" exact>
<nuxt-link :to="$i18n.path('about')" class="Header__Link" exact>
{{ $t('links.about') }}
</nuxt-link>
<nuxt-link class="Header__Link" v-if="$i18n.locale === 'en'" :to="`/fr` + $route.fullPath" active-class="none" exact>
<nuxt-link v-if="$i18n.locale === 'en'" :to="`/fr` + $route.fullPath" class="Header__Link" active-class="none" exact>
{{ $t('links.french') }}
</nuxt-link>
<nuxt-link class="Header__Link" v-else :to="$route.fullPath.replace(/^\/[^\/]+/, '')" active-class="none" exact>
<nuxt-link v-else :to="$route.fullPath.replace(/^\/[^\/]+/, '')" class="Header__Link" active-class="none" exact>
{{ $t('links.english') }}
</nuxt-link>
</nav>

View File

@ -1,11 +1,14 @@
<template>
<p v-html="data"></p>
<p v-html="data"/>
</template>
<script>
export default {
props: {
data: String
data: {
type: String,
default: ''
}
}
}
</script>

View File

@ -5,10 +5,10 @@
<span>{{ page }}/{{ totalPages }}</span>
<nuxt-link v-if="page < totalPages" :to="'?page=' + (page + 1)">Next &gt;</nuxt-link>
<a v-else class="disabled">Next &gt;</a>
<transition mode="out-in" :name="transitionName">
<transition :name="transitionName" mode="out-in">
<ul :key="page">
<li v-for="user in users" :key="user.id">
<img :src="user.avatar" class="avatar" />
<img :src="user.avatar" class="avatar" >
<span>{{ user.first_name }} {{ user.last_name }}</span>
</li>
</ul>
@ -21,6 +21,11 @@
import axios from 'axios'
export default {
data() {
return {
transitionName: this.getTransitionName(this.page)
}
},
watch: {
'$route.query.page': async function (page) {
this.$nuxt.$loading.start()
@ -41,11 +46,6 @@ export default {
users: data.data
}
},
data() {
return {
transitionName: this.getTransitionName(this.page)
}
},
methods: {
getTransitionName(newPage) {
return newPage < this.page ? 'slide-right' : 'slide-left'

View File

@ -7,7 +7,7 @@
<a v-else class="disabled">Next &gt;</a>
<ul>
<li v-for="user in users" :key="user.id">
<img :src="user.avatar" class="avatar" />
<img :src="user.avatar" class="avatar" >
<span>{{ user.first_name }} {{ user.last_name }}</span>
</li>
</ul>

View File

@ -1,5 +1,5 @@
<template>
<span v-if="false"></span>
<span v-if="false"/>
</template>
<script>

View File

@ -2,7 +2,7 @@
<div class="container">
<h1>About page</h1>
<p>Check the source code to see the custom meta tags added with our custom component <code>twitter-head-card</code></p>
<twitter-head-card></twitter-head-card>
<twitter-head-card/>
<p><nuxt-link to="/">Home page</nuxt-link></p>
</div>
</template>

View File

@ -6,15 +6,15 @@
<script>
export default {
computed: {
visits() {
return this.$store.state.visits.slice().reverse()
}
},
filters: {
hours(date) {
return date.split('T')[1].split('.')[0]
}
},
computed: {
visits() {
return this.$store.state.visits.slice().reverse()
}
}
}
</script>

View File

@ -1,6 +1,6 @@
<template>
<p class="p">
<slot></slot>
<slot/>
</p>
</template>

View File

@ -1,13 +1,16 @@
<template>
<div class="main">
<h1 class="title">{{ title }}</h1>
<slot></slot>
<slot/>
</div>
</template>
<script>
export default {
props: ['title']
title: {
type: String,
default: ''
}
}
</script>

View File

@ -1,6 +1,6 @@
<template>
<div class="container">
<img :src="thumbnailUrl" />
<img :src="thumbnailUrl" >
<p><nuxt-link to="/">Home</nuxt-link> - About</p>
</div>
</template>

View File

@ -7,7 +7,7 @@
<a v-else class="disabled">Next &gt;</a>
<ul>
<li v-for="user in users" :key="user.id">
<img :src="user.avatar" class="avatar" />
<img :src="user.avatar" class="avatar" >
<span>{{ user.first_name }} {{ user.last_name }}</span>
</li>
</ul>

View File

@ -1,7 +1,7 @@
<template>
<div class="child">
<h1>Contact</h1>
<div class="spacer" style="width: 100%; height: 3000px; background: grey"></div>
<div class="spacer" style="width: 100%; height: 3000px; background: grey"/>
</div>
</template>

View File

@ -1,7 +1,7 @@
<template>
<div class="child">
<h1>Profile</h1>
<div class="spacer" style="width: 100%; height: 3000px; background: grey"></div>
<div class="spacer" style="width: 100%; height: 3000px; background: grey"/>
</div>
</template>

View File

@ -5,6 +5,6 @@
<p><nuxt-link to="/users">Lists of users</nuxt-link></p>
<p><nuxt-link to="/long">Long page</nuxt-link></p>
<p><nuxt-link to="/long#anchor">Long page #anchor</nuxt-link></p>
<div class="spacer" style="width: 100%; height: 3000px; background: grey"></div>
<div class="spacer" style="width: 100%; height: 3000px; background: grey"/>
</div>
</template>

View File

@ -7,7 +7,7 @@
<a v-else class="disabled">Next &gt;</a>
<ul>
<li v-for="user in users" :key="user.id">
<img :src="user.avatar" class="avatar" />
<img :src="user.avatar" class="avatar" >
<span>{{ user.first_name }} {{ user.last_name }}</span>
</li>
</ul>

View File

@ -1,6 +1,6 @@
<template>
<div class="container">
<img src="~static/nuxt-black.png" />
<img src="~static/nuxt-black.png" >
<h2>Thank you for testing nuxt.js</h2>
<p>Loaded from the {{ name }}</p>
<p><nuxt-link to="/">Back home</nuxt-link></p>

View File

@ -1,6 +1,6 @@
<template>
<div class="container">
<img src="nuxt.png" />
<img src="nuxt.png" >
<h2>Hello World.</h2>
<p><nuxt-link to="/about">About</nuxt-link></p>
</div>

View File

@ -1,15 +1,20 @@
<template>
<button class="wr-button" :style="{color: color, borderColor: color}" @click="handleClick" :class="{rounded: rounded}"><slot></slot>!</button>
<button :style="{color: color, borderColor: color}" :class="{rounded: rounded}" class="wr-button" @click="handleClick"><slot/>!</button>
</template>
<script>
export default {
props: {
rounded: Boolean,
rounded: {
type: Boolean,
default: false
},
handleClick: {
type: Function,
default: () => () => null
},
color: {
type: String,
default: '#42b983'
}
}

View File

@ -1,54 +1,54 @@
<template>
<v-app id="inspire" dark>
<v-navigation-drawer
v-model="drawer"
clipped
fixed
v-model="drawer"
app
>
<v-list dense>
<v-list-group v-for="item in items" :value="item.active" v-bind:key="item.title">
<v-list-tile slot="item" @click="">
<v-list-tile-action>
<v-icon>{{ item.action }}</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile-content>
<v-list-tile-action>
<v-icon v-if="item.items">keyboard_arrow_down</v-icon>
</v-list-tile-action>
</v-list-tile>
<v-list-tile v-for="subItem in item.items" v-bind:key="subItem.title" @click="">
<v-list-tile-content>
<v-list-tile-title>{{ subItem.title }}</v-list-tile-title>
</v-list-tile-content>
<v-list-tile-action>
<v-icon>{{ subItem.action }}</v-icon>
</v-list-tile-action>
</v-list-tile>
</v-list-group>
<v-list-group v-for="item in items" :value="item.active" :key="item.title">
<v-list-tile slot="item">
<v-list-tile-action>
<v-icon>{{ item.action }}</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile-content>
<v-list-tile-action>
<v-icon v-if="item.items">keyboard_arrow_down</v-icon>
</v-list-tile-action>
</v-list-tile>
<v-list-tile v-for="subItem in item.items" :key="subItem.title">
<v-list-tile-content>
<v-list-tile-title>{{ subItem.title }}</v-list-tile-title>
</v-list-tile-content>
<v-list-tile-action>
<v-icon>{{ subItem.action }}</v-icon>
</v-list-tile-action>
</v-list-tile>
</v-list-group>
</v-list>
</v-navigation-drawer>
<v-toolbar app fixed clipped-left>
<v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
<v-toolbar-side-icon @click.stop="drawer = !drawer"/>
<v-toolbar-title>Application</v-toolbar-title>
</v-toolbar>
<v-content>
<v-container grid-list-md text-xs-center>
<v-layout row wrap>
<v-flex xs12>
<v-card dark color="primary">
<v-card-text class="px-0"><slot/></v-card-text>
</v-card>
</v-flex>
</v-layout></v-container>
<v-container grid-list-md text-xs-center>
<v-layout row wrap>
<v-flex xs12>
<v-card dark color="primary">
<v-card-text class="px-0"><slot/></v-card-text>
</v-card>
</v-flex>
</v-layout></v-container>
<v-container fluid fill-height>
<v-layout justify-center align-center>
<v-tooltip right>
<v-btn icon large :href="source" target="_blank" slot="activator">
<v-btn slot="activator" :href="source" icon large target="_blank">
<v-icon large>code</v-icon>
</v-btn>
<span>Source</span>
@ -65,14 +65,20 @@
<script>
export default {
name: 'layout',
name: 'Layout',
props: {
items: {
type: Array,
default: () => []
},
source: {
type: String,
default: ''
}
},
data: () => ({
drawer: null
}),
props: {
items: Array,
source: String
}
})
}
</script>

View File

@ -1,9 +1,9 @@
<template>
<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 class="Triangle Triangle--two"/>
<div class="Triangle Triangle--one"/>
<div class="Triangle Triangle--three"/>
<div class="Triangle Triangle--four"/>
</div>
</template>

View File

@ -1,69 +1,70 @@
<template>
<v-app>
<v-container fluid>
<div class="main">
<h1>Welcome to STORYBOOK</h1>
<p>
This is a UI component dev environment for your app.
</p>
<div class="main">
<h1>Welcome to STORYBOOK</h1>
<p>
This is a UI component dev environment for your app.
</p>
<p>The repo for this project exists here
<a class="link"
href="https://github.com/white-rabbit-japan/vuetify-storyboard-boilerplate"
target="_blank"
rel="noopener noreferrer">
vuetify-storyboard-boilerplate
</a>
</p>
<p>The repo for this project exists here
<a
class="link"
href="https://github.com/white-rabbit-japan/vuetify-storyboard-boilerplate"
target="_blank"
rel="noopener noreferrer">
vuetify-storyboard-boilerplate
</a>
</p>
<p>
We've added some basic stories inside the
<p>
We've added some basic stories inside the
<code class="code">src/stories</code>
directory.
A story is a single state of one or more UI components. You can have as many stories as you want.
(Basically a story is like a visual test case.)
</p>
<p>
See these sample
<code class="code">src/stories</code>
directory.
A story is a single state of one or more UI components. You can have as many stories as you want.
(Basically a story is like a visual test case.)
</p>
<p>
See these sample
<a class="link" @click.prevent="showApp" role="button" tabIndex="0">stories</a>
for a component called
<a class="link" role="button" tabIndex="0" @click.prevent="showApp">stories</a>
for a component called
<code class="code">Button</code> .
</p>
<p>
Just like that, you can add your own components as stories.
You can also edit those components and see changes right away.
(Try editing the
<code class="code">Button</code> component located at
<code class="code">src/stories/Button.js</code>.)
</p>
<p>
This is just one thing you can do with Storybook.
Have a look at the
<code class="code">Button</code> .
</p>
<p>
Just like that, you can add your own components as stories.
You can also edit those components and see changes right away.
(Try editing the
<code class="code">Button</code> component located at
<code class="code">src/stories/Button.js</code>.)
</p>
<p>
This is just one thing you can do with Storybook.
Have a look at the
<a class="link" href="https://github.com/storybooks/storybook" target="_blank" rel="noopener noreferrer">
Storybook
</a>
repo for more information.
</p>
<p class="note">
<b>NOTE:</b>
Have a look at the
<a class="link" href="https://github.com/storybooks/storybook" target="_blank" rel="noopener noreferrer">
Storybook
</a>
repo for more information.
</p>
<p class="note">
<b>NOTE:</b>
Have a look at the
<code class="code">.storybook/webpack.config.js</code>
to add webpack loaders and plugins you are using in this project.
</p>
</div>
<code class="code">.storybook/webpack.config.js</code>
to add webpack loaders and plugins you are using in this project.
</p>
</div>
</v-container>
</v-container>
</v-app>
</template>
<script>
export default {
name: 'welcome',
name: 'Welcome',
props: {
showApp: {

View File

@ -9,28 +9,28 @@
>
<v-list>
<v-list-tile
router
v-for="(item, i) in items"
:to="item.to"
:key="i"
v-for="(item, i) in items"
router
exact
>
<v-list-tile-action>
<v-icon v-html="item.icon"></v-icon>
<v-icon v-html="item.icon"/>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title v-text="item.title"></v-list-tile-title>
<v-list-tile-title v-text="item.title"/>
</v-list-tile-content>
</v-list-tile>
</v-list>
</v-navigation-drawer>
<v-toolbar fixed app :clipped-left="clipped">
<v-toolbar-side-icon @click="drawer = !drawer"></v-toolbar-side-icon>
<v-toolbar :clipped-left="clipped" fixed app>
<v-toolbar-side-icon @click="drawer = !drawer"/>
<v-btn
icon
@click.stop="miniVariant = !miniVariant"
>
<v-icon v-html="miniVariant ? 'chevron_right' : 'chevron_left'"></v-icon>
<v-icon v-html="miniVariant ? 'chevron_right' : 'chevron_left'"/>
</v-btn>
<v-btn
icon
@ -44,8 +44,8 @@
>
<v-icon>remove</v-icon>
</v-btn>
<v-toolbar-title v-text="title"></v-toolbar-title>
<v-spacer></v-spacer>
<v-toolbar-title v-text="title"/>
<v-spacer/>
<v-btn
icon
@click.stop="rightDrawer = !rightDrawer"
@ -59,9 +59,9 @@
</v-container>
</v-content>
<v-navigation-drawer
temporary
:right="right"
v-model="rightDrawer"
temporary
fixed
>
<v-list>
@ -80,21 +80,21 @@
</template>
<script>
export default {
data() {
return {
clipped: false,
drawer: true,
fixed: false,
items: [
{ icon: 'apps', title: 'Welcome', to: '/' },
{ icon: 'bubble_chart', title: 'Inspire', to: '/inspire' }
],
miniVariant: false,
right: true,
rightDrawer: false,
title: 'Vuetify.js'
}
export default {
data() {
return {
clipped: false,
drawer: true,
fixed: false,
items: [
{ icon: 'apps', title: 'Welcome', to: '/' },
{ icon: 'bubble_chart', title: 'Inspire', to: '/inspire' }
],
miniVariant: false,
right: true,
rightDrawer: false,
title: 'Vuetify.js'
}
}
}
</script>

View File

@ -22,7 +22,7 @@
<a href="https://github.com/nuxt/nuxt.js" target="_blank">Nuxt GitHub</a>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-spacer/>
<v-btn color="primary" flat nuxt to="/inspire">Continue</v-btn>
</v-card-actions>
</v-card>

View File

@ -4,7 +4,7 @@
<p class="font-bold">Be Warned!</p>
<p>This page has been {{ mode }}-side rendered!</p>
</div>
<button @click="$router.push('/')" class="mt-4 bg-blue hover:bg-blue-light text-white font-bold py-2 px-4 border-b-4 border-blue-dark hover:border-blue rounded">
<button class="mt-4 bg-blue hover:bg-blue-light text-white font-bold py-2 px-4 border-b-4 border-blue-dark hover:border-blue rounded" @click="$router.push('/')">
Back to home
</button>
</div>

View File

@ -12,6 +12,6 @@
<span class="inline-block bg-grey-lighter rounded-full px-3 py-1 text-sm font-semibold text-slate">#winter</span>
</div>
</div>
<button @click="$router.push('/about')" class="bg-blue mt-4 hover:bg-blue-dark text-white font-bold py-2 px-4 rounded">About</button>
<button class="bg-blue mt-4 hover:bg-blue-dark text-white font-bold py-2 px-4 rounded" @click="$router.push('/about')">About</button>
</div>
</template>

View File

@ -1,9 +1,9 @@
<template>
<div class="ba b--black-20 mw5 ma2">
<img :src="'https://robots.johnlindquist.com/' + person.first_name + '_' + person.last_name" />
<img :src="'https://robots.johnlindquist.com/' + person.first_name + '_' + person.last_name" >
<div class="flex flex-column items-center pa2 b--black-20">
<div class="f4">{{person.first_name}} {{person.last_name}}</div>
<button @click="select(person.id)" class="w-100 bg-blue dim mv2 pv2 bn pointer">Select</button>
<div class="f4">{{ person.first_name }} {{ person.last_name }}</div>
<button class="w-100 bg-blue dim mv2 pv2 bn pointer" @click="select(person.id)">Select</button>
</div>
</div>
</template>

View File

@ -2,12 +2,12 @@
<section class="pa4">
<div class="bg-white-90 pa4">
<div class="f1">Nuxt TypeScript Starter</div>
<div class="f3">Selected Person: {{selectedPerson.first_name}} {{selectedPerson.last_name}}</div>
{{selected}}
<div class="f3">Selected Person: {{ selectedPerson.first_name }} {{ selectedPerson.last_name }}</div>
{{ selected }}
</div>
<div class="flex flex-wrap ph2 justify-between bg-white-80">
<div v-for="person in people" :key="person.id">
<Card :person="person"></Card>
<Card :person="person"/>
</div>
</div>
</section>

View File

@ -1,8 +1,8 @@
<template>
<div class="uk-card uk-card-body">
<p>Hi from {{ name }}</p>
<span class="uk-margin-small-right" uk-icon="icon: check"></span>
<a href="#" uk-icon="icon: heart"></a>
<span class="uk-margin-small-right" uk-icon="icon: check"/>
<a href="#" uk-icon="icon: heart"/>
<hr class="uk-divider-icon">
<nuxt-link to="/">Home page</nuxt-link>
</div>

View File

@ -1,9 +1,9 @@
<template>
<div>
<input v-model="msg">
<p>msg: {{msg}}</p>
<p>env: {{env}}</p>
<p>computed msg: {{computedMsg}}</p>
<p>msg: {{ msg }}</p>
<p>env: {{ env }}</p>
<p>computed msg: {{ computedMsg }}</p>
<button @click="greet">Greet</button>
<p><nuxt-link to="/about">About page</nuxt-link></p>
</div>

View File

@ -1,9 +1,9 @@
<template>
<div>
<input v-model="msg">
<p>msg: {{msg}}</p>
<p>env: {{env}}</p>
<p>computed msg: {{computedMsg}}</p>
<p>msg: {{ msg }}</p>
<p>env: {{ env }}</p>
<p>computed msg: {{ computedMsg }}</p>
<button @click="greet">Greet</button>
<p><nuxt-link to="/about">About page</nuxt-link></p>
</div>

View File

@ -1,5 +1,5 @@
<template>
<Child :env="env" ></Child>
<Child :env="env" />
</template>
<script>

View File

@ -1,18 +1,17 @@
<template>
<div>
<p>
<h3>Index Module</h3>
<button @click="increment">{{ counter }}</button>
<br>
<nuxt-link to="/about">About</nuxt-link>
<br>
<br>
<h3>Todo Module</h3>
<nuxt-link to="/todos">Todos</nuxt-link>
<br>
<br>
<h3>Nested Modules</h3>
<nuxt-link to="/website">Website</nuxt-link>
<p/><h3>Index Module</h3>
<button @click="increment">{{ counter }}</button>
<br>
<nuxt-link to="/about">About</nuxt-link>
<br>
<br>
<h3>Todo Module</h3>
<nuxt-link to="/todos">Todos</nuxt-link>
<br>
<br>
<h3>Nested Modules</h3>
<nuxt-link to="/website">Website</nuxt-link>
</p>
</div>
</template>

View File

@ -3,7 +3,7 @@
<h2>Todos</h2>
<ul>
<li v-for="(todo, index) in todos" :key="index">
<input type="checkbox" :checked="todo.done" @change="toggle(todo)">
<input :checked="todo.done" type="checkbox" @change="toggle(todo)">
<span :class="{ done: todo.done }">{{ todo.text }}</span>
</li>
<li><input placeholder="What needs to be done?" @keyup.enter="addTodo"></li>

View File

@ -3,13 +3,13 @@
<h2>Articles</h2>
<ul>
<li v-for="(article, index) in articles" :key="index">
<span>{{article}}</span>
<span>{{ article }}</span>
</li>
</ul>
<h2>Comments <small>(nested under articles)</small></h2>
<ul>
<li v-for="(comment, index) in comments" :key="index">
<span>{{comment}}</span>
<span>{{ comment }}</span>
</li>
</ul>
<nuxt-link to="/">Home</nuxt-link>

View File

@ -8,9 +8,7 @@ module.exports = {
parser: 'babel-eslint'
},
extends: [
// https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
// consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
'plugin:vue/strongly-recommended'
'plugin:vue/recommended'
],
// required to lint *.vue files
plugins: [

View File

@ -17,22 +17,22 @@
<div class="links">
<a
:class="needWorkerSetup ? 'hidden' : 'visible'"
@click="test"
class="button button--green">Test Worker</a>
class="button button--green"
@click="test">Test Worker</a>
<a
:class="needWorkerSetup ? 'hidden' : 'visible'"
@click="long(4000)"
class="button button--green">Execute long running Worker</a>
class="button button--green"
@click="long(4000)">Execute long running Worker</a>
<a
:class="needWorkerSetup || !longRunningWorkers.length ? 'hidden' : 'visible'"
@click="freeWorker"
class="button button--green">Free long running Worker</a>
class="button button--green"
@click="freeWorker">Free long running Worker</a>
<a
@click="removeWorker"
class="button button--grey">Remove Web Worker</a>
class="button button--grey"
@click="removeWorker">Remove Web Worker</a>
<a
@click="createWorkers"
class="button button--grey">Create more Workers</a>
class="button button--grey"
@click="createWorkers">Create more Workers</a>
</div>
</div>
</section>
@ -45,11 +45,6 @@ export default {
components: {
AppLogo
},
computed: {
needWorkerSetup () {
return this.workers.length === 0 && this.longRunningWorkers.length === 0
}
},
data () {
return {
notification: '',
@ -59,6 +54,11 @@ export default {
longIndex: 0
}
},
computed: {
needWorkerSetup () {
return this.workers.length === 0 && this.longRunningWorkers.length === 0
}
},
watch: {
workers (workers) {
if (workers.length === 0) this.notification = 'Zero free Web Workers - click "Create more Workers"'

View File

@ -6,6 +6,9 @@
<script>
export default {
props: ['author']
author: {
type: String,
default: ''
}
}
</script>

View File

@ -22,4 +22,3 @@
@import "~bulma";
@import "~buefy/src/scss/buefy";
</style>

View File

@ -4,7 +4,7 @@
<table>
<thead>
<tr>
<th>Key</th><th>Value</th><th></th>
<th>Key</th><th>Value</th><th/>
</tr>
</thead>
<tbody>
@ -17,8 +17,8 @@
</table>
<h2>Add a new cookie</h2>
<form @submit.prevent="addCookie">
<input type="text" v-model="newCookie.key" placeholder="Key" class="key"/>:
<input type="text" v-model="newCookie.value" placeholder="Value" class="value"/>
<input v-model="newCookie.key" type="text" placeholder="Key" class="key">:
<input v-model="newCookie.value" type="text" placeholder="Value" class="value">
<button type="submit">Add</button>
</form>
</div>

View File

@ -4,7 +4,7 @@
<span>Element Example</span>
</div>
<div>
<nuxt></nuxt>
<nuxt/>
</div>
</el-card>
</template>

View File

@ -1,29 +1,29 @@
<template>
<div class="elm-demo">
<el-form :model="account" :rules="formRules" ref="elm-demo" label-width="100px">
<el-form ref="elm-demo" :model="account" :rules="formRules" label-width="100px">
<el-row type="flex" justify="flex-start">
<el-col :xs="24" :sm="10">
<el-form-item label="Account Name" prop="name" required>
<el-input v-model="account.name"></el-input>
<el-input v-model="account.name"/>
</el-form-item>
</el-col>
</el-row>
<el-row type="flex" justify="flex-start">
<el-col :xs="24" :sm="10">
<el-form-item label="Date" prop="date" required>
<el-date-picker v-model="account.date" style="width: 100%;"></el-date-picker>
<el-date-picker v-model="account.date" style="width: 100%;"/>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="{span: 3, offset: 2}">
<el-form-item label="Subscribe" prop="subscribe">
<el-switch on-text="" off-text="" v-model="account.subscribe"></el-switch>
<el-switch v-model="account.subscribe" on-text="" off-text=""/>
</el-form-item>
</el-col>
</el-row>
<el-row type="flex" justify="flex-start">
<el-col :xs="24" :sm="10">
<el-form-item label="Rate" prop="rate">
<el-rate v-model="account.rate" :colors="['#99A9BF', '#F7BA2A', '#FF9900']"></el-rate>
<el-rate v-model="account.rate" :colors="['#99A9BF', '#F7BA2A', '#FF9900']"/>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="{span: 10, offset: 2}">

View File

@ -1,7 +1,7 @@
module.exports = {
root: true,
parser: 'babel-eslint',
parserOptions: {
parser: 'babel-eslint',
sourceType: 'module'
},
env: {
@ -9,10 +9,13 @@ module.exports = {
node: true,
mocha: true
},
extends: 'standard',
extends: [
'standard',
'plugin:vue/recommended'
],
// required to lint *.vue files
plugins: [
'html'
'vue'
],
// add your custom rules here
rules: {
@ -24,13 +27,16 @@ module.exports = {
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
// do not allow console.logs etc...
'no-console': 2,
'space-before-function-paren': [
2,
{
anonymous: 'always',
named: 'never'
}
],
'space-before-function-paren': [2, {
anonymous: 'always',
named: 'never'
}],
'vue/no-parsing-error': [2, {
'x-invalid-end-tag': false
}],
"vue/max-attributes-per-line": [2, {
"singleline": 5,
}]
},
globals: {}
}

View File

@ -1,43 +1,43 @@
<template>
<div>
<mu-appbar title="Nuxt.js">
<mu-icon-button icon="menu" slot="left" @click="toggle()" />
<mu-icon-menu icon="expand_more" slot="right">
<mu-menu-item value="1" title="One" />
<mu-menu-item value="2" title="Two" />
<mu-menu-item value="3" title="Three" />
</mu-icon-menu>
</mu-appbar>
<mu-drawer :open="open" @close="toggle()" :docked=false>
<mu-list>
<mu-list-item title="Menu Item 1" />
<mu-list-item title="Menu Item 2" />
<mu-list-item title="Menu Item 3" />
</mu-list>
</mu-drawer>
<div class="content">
<mu-raised-button label="Primary" class="demo-raised-button" primary/>
</div>
</div>
<div>
<mu-appbar title="Nuxt.js">
<mu-icon-button slot="left" icon="menu" @click="toggle()" />
<mu-icon-menu slot="right" icon="expand_more">
<mu-menu-item value="1" title="One" />
<mu-menu-item value="2" title="Two" />
<mu-menu-item value="3" title="Three" />
</mu-icon-menu>
</mu-appbar>
<mu-drawer :open="open" :docked="false" @close="toggle()">
<mu-list>
<mu-list-item title="Menu Item 1" />
<mu-list-item title="Menu Item 2" />
<mu-list-item title="Menu Item 3" />
</mu-list>
</mu-drawer>
<div class="content">
<mu-raised-button label="Primary" class="demo-raised-button" primary/>
</div>
</div>
</template>
<script>
export default {
data() {
return {
open: false
}
},
methods: {
toggle(flag) {
this.open = !this.open
}
}
}
export default {
data() {
return {
open: false
}
},
methods: {
toggle(flag) {
this.open = !this.open
}
}
}
</script>
<style>
.content {
margin: 10px
}
.content {
margin: 10px
}
</style>

View File

@ -4,7 +4,7 @@
<p class="font-bold">Be Warned!</p>
<p>This page has been {{ mode }}-side rendered!</p>
</div>
<button @click="$router.push('/')" class="mt-4 bg-blue hover:bg-blue-light text-white font-bold py-2 px-4 border-b-4 border-blue-dark hover:border-blue rounded">
<button class="mt-4 bg-blue hover:bg-blue-light text-white font-bold py-2 px-4 border-b-4 border-blue-dark hover:border-blue rounded" @click="$router.push('/')">
Back to home
</button>
</div>

View File

@ -12,6 +12,6 @@
<span class="inline-block bg-grey-lighter rounded-full px-3 py-1 text-sm font-semibold text-slate">#winter</span>
</div>
</div>
<button @click="$router.push('/about')" class="bg-blue mt-4 hover:bg-blue-dark text-white font-bold py-2 px-4 rounded">About</button>
<button class="bg-blue mt-4 hover:bg-blue-dark text-white font-bold py-2 px-4 rounded" @click="$router.push('/about')">About</button>
</div>
</template>

View File

@ -3,13 +3,13 @@
<ul class="pages">
<li class="chat page">
<div class="chatArea">
<ul class="messages" ref="messages">
<li class="message" v-for="(message, index) in messages" :key="index">
<ul ref="messages" class="messages">
<li v-for="(message, index) in messages" :key="index" class="message">
<i :title="message.date">{{ message.date.split('T')[1].slice(0, -2) }}</i>: {{ message.text }}
</li>
</ul>
</div>
<input class="inputMessage" type="text" v-model="message" @keyup.enter="sendMessage" placeholder="Type here..." />
<input v-model="message" class="inputMessage" type="text" placeholder="Type here..." @keyup.enter="sendMessage" >
</li>
</ul>
</div>

View File

@ -6,26 +6,26 @@
</template>
<script>
export default {
data() {
return { name: 'world', className: 'red' }
},
methods: {
changeColor() {
this.className = this.className === 'red' ? 'blue' : 'green'
}
export default {
data() {
return { name: 'world', className: 'red' }
},
methods: {
changeColor() {
this.className = this.className === 'red' ? 'blue' : 'green'
}
}
}
</script>
<style>
.red {
color: red;
}
.blue {
color: blue;
}
.green {
color: green;
}
.red {
color: red;
}
.blue {
color: blue;
}
.green {
color: green;
}
</style>

View File

@ -39,7 +39,7 @@
</md-list>
</md-drawer>
<md-drawer class="md-right" :md-active.sync="showSidepanel">
<md-drawer :md-active.sync="showSidepanel" class="md-right">
<md-toolbar class="md-transparent" md-elevation="0">
<span class="md-title">Favorites</span>
</md-toolbar>

View File

@ -4,7 +4,7 @@
<v-toolbar-side-icon @click.native.stop="drawer = !drawer" />
<v-toolbar-title>Toolbar</v-toolbar-title>
</v-toolbar>
<v-navigation-drawer left fixed app v-model="drawer">
<v-navigation-drawer v-model="drawer" left fixed app>
<v-list>
<v-list-tile router nuxt href="/">
<v-list-tile-title>Home</v-list-tile-title>

View File

@ -1,6 +1,6 @@
<template>
<v-carousel>
<v-carousel-item v-for="(src, i) in images" v-bind:src="src" :key="i"></v-carousel-item>
<v-carousel-item v-for="(src, i) in images" :src="src" :key="i"/>
</v-carousel>
</template>
@ -15,4 +15,4 @@ export default {
]
})
}
</script>
</script>

View File

@ -5,4 +5,4 @@
<v-btn secondary>Secondary button</v-btn>
<v-btn success>Success button</v-btn>
</div>
</template>
</template>

View File

@ -14,6 +14,6 @@
</vk-dropdown>
</div>
<hr class="uk-divider-icon">
<vk-icon icon="heart"></vk-icon>
<vk-icon icon="heart"/>
</vk-card>
</template>

View File

@ -1,9 +1,9 @@
<template>
<nuxt></nuxt>
<nuxt/>
</template>
<style>
body {
background-color: #fbf9fe;
}
</style>
</style>

View File

@ -1,12 +1,11 @@
<template>
<div>
<group title="vux demo">
<cell title="cell" value="click me" is-link @click.native="alert"></cell>
<cell title="cell" value="click me" is-link @click.native="alert"/>
</group>
</div>
</template>
<script>
export default {
head() {
@ -20,4 +19,4 @@ export default {
}
}
}
</script>
</script>

View File

@ -142,7 +142,6 @@
"eslint": "^4.19.1",
"eslint-config-standard": "^11.0.0",
"eslint-config-standard-jsx": "^5.0.0",
"eslint-plugin-html": "^4.0.2",
"eslint-plugin-import": "^2.12.0",
"eslint-plugin-jest": "^21.17.0",
"eslint-plugin-node": "^6.0.0",

View File

@ -1,5 +1,5 @@
<template>
<div></div>
<div/>
</template>
<style>

View File

@ -1,5 +1,3 @@
<template></template>
<script>
export default {
middleware: 'redirect',

View File

@ -1,7 +1,7 @@
<template>
<div>
<h1>I am the {{ name }}</h1>
<nuxt-child></nuxt-child>
<nuxt-child/>
</div>
</template>

View File

@ -1,8 +1,8 @@
<template>
<div>
<h4>_slug: <i data-date-child-slug>{{ date }}</i></h4>
<input ref="search" data-test-search-input type="text" v-model="q" @input="update"/>
<ul><li data-test-search-result v-for="s in searchResults" :key="s">{{ s }}</li></ul>
<input ref="search" v-model="q" data-test-search-input type="text" @input="update">
<ul><li v-for="s in searchResults" :key="s" data-test-search-result>{{ s }}</li></ul>
</div>
</template>
@ -24,6 +24,11 @@ async function search(q) {
}
export default {
data() {
return {
q: this.$route.query.q || ''
}
},
watch: {
'$route.query.q': async function (q) {
this.searchResults = await search(q)
@ -36,11 +41,6 @@ export default {
date: Date.now()
}
},
data() {
return {
q: this.$route.query.q || ''
}
},
mounted() {
this.$refs.search.selectionStart = this.$refs.search.selectionEnd = this.$refs.search.value.length
this.$refs.search.focus()

View File

@ -1,3 +1,3 @@
<template>
<h1>pages/_key/_id.vue</h1>
</template>
<h1>pages/_key/_id.vue</h1>
</template>

View File

@ -1,3 +1,3 @@
<template>
<h1>pages/_slug.vue</h1>
</template>
<h1>pages/_slug.vue</h1>
</template>

View File

@ -1,3 +1,3 @@
<template>
<h1>pages/test/_.vue</h1>
</template>
<h1>pages/test/_.vue</h1>
</template>

View File

@ -1,3 +1,3 @@
<template>
<h1>pages/test/index.vue</h1>
</template>
<h1>pages/test/index.vue</h1>
</template>

View File

@ -1,7 +1,7 @@
<template>
<div>
<h1>I'm RED</h1>
</div>
<div>
<h1>I'm RED</h1>
</div>
</template>
<style scoped>

View File

@ -1,6 +1,6 @@
<template>
<div>
<h1>Module Layouts</h1>
<nuxt />
</div>
<div>
<h1>Module Layouts</h1>
<nuxt />
</div>
</template>

View File

@ -4,4 +4,4 @@
<br>
<nuxt/>
</div>
</template>
</template>

View File

@ -1,7 +1,7 @@
<template>
<foobar>
{{id}}
</foobar>
<foobar>
{{ id }}
</foobar>
</template>
<script>
@ -14,4 +14,4 @@ export default {
}
}
}
</script>
</script>

View File

@ -1,7 +1,7 @@
<template>
<div>
<div>
<async-test/>
</div>
</div>
</template>
<script>
@ -12,4 +12,4 @@ export default {
AsyncTest
}
}
</script>
</script>

View File

@ -1,5 +1,5 @@
<template>
<foobar>{{id}}</foobar>
<foobar>{{ id }}</foobar>
</template>
<script>

View File

@ -1,7 +1,7 @@
<template>
<div>
<div>
<test/>
</div>
</div>
</template>
<script>
@ -12,4 +12,4 @@ export default {
test
}
}
</script>
</script>

View File

@ -1,5 +1,5 @@
<template>
<foobar>{{id}}</foobar>
<foobar>{{ id }}</foobar>
</template>
<script>

View File

@ -1,5 +1,5 @@
<template>
<foobar>{{$store.__id}}</foobar>
<foobar>{{ $store.__id }}</foobar>
</template>
<script>

View File

@ -1,5 +1,5 @@
<template>
<foobar>
{{$store.state[$route.query.onServerInit === '1' ? 'id2': 'id']}}
</foobar>
</template>
<foobar>
{{ $store.state[$route.query.onServerInit === '1' ? 'id2': 'id'] }}
</foobar>
</template>

View File

@ -1,5 +1,5 @@
<template lang="html">
<div class="loading-page" v-if="loading">
<div v-if="loading" class="loading-page">
<p>Loading...</p>
</div>
</template>

View File

@ -17,4 +17,4 @@
body {
font-family: 'Roboto';
}
</style>
</style>

View File

@ -18,4 +18,3 @@ body {
font-family: 'Roboto';
}
</style>

View File

@ -9,4 +9,3 @@ export default {
layout: 'desktop/default'
}
</script>

View File

@ -9,4 +9,3 @@ export default {
layout: 'mobile/default'
}
</script>

View File

@ -2345,7 +2345,7 @@ domain-browser@^1.1.1:
version "1.2.0"
resolved "https://registry.yarnpkg.com/domain-browser/-/domain-browser-1.2.0.tgz#3d31f50191a6749dd1375a7f522e823d42e54eda"
domelementtype@1, domelementtype@^1.3.0:
domelementtype@1:
version "1.3.0"
resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.3.0.tgz#b17aed82e8ab59e52dd9c19b1756e0fc187204c2"
@ -2365,12 +2365,6 @@ domhandler@2.1:
dependencies:
domelementtype "1"
domhandler@^2.3.0:
version "2.4.2"
resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-2.4.2.tgz#8805097e933d65e85546f726d60f5eb88b44f803"
dependencies:
domelementtype "1"
domutils@1.1:
version "1.1.6"
resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.1.6.tgz#bddc3de099b9a2efacc51c623f28f416ecc57485"
@ -2384,13 +2378,6 @@ domutils@1.5.1:
dom-serializer "0"
domelementtype "1"
domutils@^1.5.1:
version "1.7.0"
resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.7.0.tgz#56ea341e834e06e6748af7a1cb25da67ea9f8c2a"
dependencies:
dom-serializer "0"
domelementtype "1"
dot-prop@^4.1.1:
version "4.2.0"
resolved "https://registry.yarnpkg.com/dot-prop/-/dot-prop-4.2.0.tgz#1f19e0c2e1aa0e32797c49799f2837ac6af69c57"
@ -2477,7 +2464,7 @@ enhanced-resolve@^4.1.0:
memory-fs "^0.4.0"
tapable "^1.0.0"
entities@^1.1.1, entities@~1.1.1:
entities@~1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/entities/-/entities-1.1.1.tgz#6e5c2d0a5621b5dadaecef80b90edfb5cd7772f0"
@ -2591,12 +2578,6 @@ eslint-module-utils@^2.2.0:
debug "^2.6.8"
pkg-dir "^1.0.0"
eslint-plugin-html@^4.0.2:
version "4.0.3"
resolved "https://registry.yarnpkg.com/eslint-plugin-html/-/eslint-plugin-html-4.0.3.tgz#97d52dcf9e22724505d02719fbd02754013c8a17"
dependencies:
htmlparser2 "^3.8.2"
eslint-plugin-import@^2.12.0:
version "2.12.0"
resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.12.0.tgz#dad31781292d6664b25317fd049d2e2b2f02205d"
@ -3436,17 +3417,6 @@ html-webpack-plugin@^3.2.0:
toposort "^1.0.0"
util.promisify "1.0.0"
htmlparser2@^3.8.2:
version "3.9.2"
resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-3.9.2.tgz#1bdf87acca0f3f9e53fa4fcceb0f4b4cbb00b338"
dependencies:
domelementtype "^1.3.0"
domhandler "^2.3.0"
domutils "^1.5.1"
entities "^1.1.1"
inherits "^2.0.1"
readable-stream "^2.0.2"
htmlparser2@~3.3.0:
version "3.3.0"
resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-3.3.0.tgz#cc70d05a59f6542e43f0e685c982e14c924a9efe"