mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-23 06:05:11 +00:00
refactor: use eslint-plugin-vue instead of eslint-plugin-html (#3517)
This commit is contained in:
Clark Du
Sébastien Chopin
parent
d31aeaad6c
commit
2b5c367efa
20
.eslintrc.js
20
.eslintrc.js
@ -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,
|
||||
{
|
||||
'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: {}
|
||||
|
||||
@ -12,4 +12,3 @@
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@ -10,7 +10,7 @@
|
||||
<ul>
|
||||
<li>Vue.js</li>
|
||||
<li>Nuxt.js</li>
|
||||
<li>= <3</li>
|
||||
<li>= <3</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<h1>Dog</h1>
|
||||
<img :src="dog" />
|
||||
<img :src="dog" >
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'date',
|
||||
name: 'Date',
|
||||
serverCacheKey() {
|
||||
// Will change every 10 secondes
|
||||
return Math.floor(Date.now() / 10000)
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<img src="logo.png"/>
|
||||
<img src="logo.png">
|
||||
<nuxt/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -8,7 +8,12 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['error']
|
||||
props: {
|
||||
error: {
|
||||
type: Object,
|
||||
default: null
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="loading-page" v-if="loading">
|
||||
<div v-if="loading" class="loading-page">
|
||||
<p>Loading...</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -5,7 +5,10 @@
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
data: String
|
||||
data: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -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
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -9,7 +9,12 @@
|
||||
<script>
|
||||
export default {
|
||||
layout: ({ isMobile }) => isMobile ? 'mobile' : 'default',
|
||||
props: ['error']
|
||||
props: {
|
||||
error: {
|
||||
type: Object,
|
||||
default: null
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -5,10 +5,10 @@
|
||||
<span>{{ page }}/{{ totalPages }}</span>
|
||||
<nuxt-link v-if="page < totalPages" :to="'?page=' + (page + 1)">Next ></nuxt-link>
|
||||
<a v-else class="disabled">Next ></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'
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
<a v-else class="disabled">Next ></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>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<span v-if="false"></span>
|
||||
<span v-if="false"/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<p class="p">
|
||||
<slot></slot>
|
||||
<slot/>
|
||||
</p>
|
||||
</template>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
<a v-else class="disabled">Next ></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>
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
<a v-else class="disabled">Next ></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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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'
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,14 +1,14 @@
|
||||
<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-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>
|
||||
@ -19,7 +19,7 @@
|
||||
<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 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>
|
||||
@ -32,7 +32,7 @@
|
||||
|
||||
</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>
|
||||
@ -48,7 +48,7 @@
|
||||
<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>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -8,7 +8,8 @@
|
||||
</p>
|
||||
|
||||
<p>The repo for this project exists here
|
||||
<a class="link"
|
||||
<a
|
||||
class="link"
|
||||
href="https://github.com/white-rabbit-japan/vuetify-storyboard-boilerplate"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer">
|
||||
@ -27,7 +28,7 @@
|
||||
<p>
|
||||
See these sample
|
||||
|
||||
<a class="link" @click.prevent="showApp" role="button" tabIndex="0">stories</a>
|
||||
<a class="link" role="button" tabIndex="0" @click.prevent="showApp">stories</a>
|
||||
for a component called
|
||||
|
||||
<code class="code">Button</code> .
|
||||
@ -63,7 +64,7 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'welcome',
|
||||
name: 'Welcome',
|
||||
|
||||
props: {
|
||||
showApp: {
|
||||
|
||||
@ -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,7 +80,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
clipped: false,
|
||||
@ -96,5 +96,5 @@
|
||||
title: 'Vuetify.js'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<Child :env="env" ></Child>
|
||||
<Child :env="env" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<p>
|
||||
<h3>Index Module</h3>
|
||||
<p/><h3>Index Module</h3>
|
||||
<button @click="increment">{{ counter }}</button>
|
||||
<br>
|
||||
<nuxt-link to="/about">About</nuxt-link>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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: [
|
||||
|
||||
@ -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"'
|
||||
|
||||
@ -6,6 +6,9 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['author']
|
||||
author: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -22,4 +22,3 @@
|
||||
@import "~bulma";
|
||||
@import "~buefy/src/scss/buefy";
|
||||
</style>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<span>Element Example</span>
|
||||
</div>
|
||||
<div>
|
||||
<nuxt></nuxt>
|
||||
<nuxt/>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
@ -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}">
|
||||
|
||||
@ -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,
|
||||
{
|
||||
'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: {}
|
||||
}
|
||||
|
||||
@ -1,14 +1,14 @@
|
||||
<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-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" @close="toggle()" :docked=false>
|
||||
<mu-drawer :open="open" :docked="false" @close="toggle()">
|
||||
<mu-list>
|
||||
<mu-list-item title="Menu Item 1" />
|
||||
<mu-list-item title="Menu Item 2" />
|
||||
@ -22,7 +22,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
open: false
|
||||
@ -33,11 +33,11 @@
|
||||
this.open = !this.open
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.content {
|
||||
.content {
|
||||
margin: 10px
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
export default {
|
||||
data() {
|
||||
return { name: 'world', className: 'red' }
|
||||
},
|
||||
@ -15,17 +15,17 @@
|
||||
this.className = this.className === 'red' ? 'blue' : 'green'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.red {
|
||||
.red {
|
||||
color: red;
|
||||
}
|
||||
.blue {
|
||||
}
|
||||
.blue {
|
||||
color: blue;
|
||||
}
|
||||
.green {
|
||||
}
|
||||
.green {
|
||||
color: green;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<nuxt></nuxt>
|
||||
<nuxt/>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
|
||||
@ -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() {
|
||||
|
||||
@ -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",
|
||||
|
||||
2
test/fixtures/basic/pages/extractCSS.vue
vendored
2
test/fixtures/basic/pages/extractCSS.vue
vendored
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div></div>
|
||||
<div/>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
|
||||
@ -1,5 +1,3 @@
|
||||
<template></template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
middleware: 'redirect',
|
||||
|
||||
2
test/fixtures/children/pages/parent.vue
vendored
2
test/fixtures/children/pages/parent.vue
vendored
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<h1>I am the {{ name }}</h1>
|
||||
<nuxt-child></nuxt-child>
|
||||
<nuxt-child/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@ -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()
|
||||
|
||||
4
test/fixtures/extract-css/pages/index.vue
vendored
4
test/fixtures/extract-css/pages/index.vue
vendored
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<div>
|
||||
<h1>I'm RED</h1>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
6
test/fixtures/ssr/components/test.vue
vendored
6
test/fixtures/ssr/components/test.vue
vendored
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<foobar>
|
||||
{{id}}
|
||||
</foobar>
|
||||
<foobar>
|
||||
{{ id }}
|
||||
</foobar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
4
test/fixtures/ssr/pages/asyncComponent.vue
vendored
4
test/fixtures/ssr/pages/asyncComponent.vue
vendored
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<div>
|
||||
<async-test/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
2
test/fixtures/ssr/pages/asyncData.vue
vendored
2
test/fixtures/ssr/pages/asyncData.vue
vendored
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<foobar>{{id}}</foobar>
|
||||
<foobar>{{ id }}</foobar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
4
test/fixtures/ssr/pages/component.vue
vendored
4
test/fixtures/ssr/pages/component.vue
vendored
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<div>
|
||||
<test/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
2
test/fixtures/ssr/pages/data.vue
vendored
2
test/fixtures/ssr/pages/data.vue
vendored
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<foobar>{{id}}</foobar>
|
||||
<foobar>{{ id }}</foobar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
2
test/fixtures/ssr/pages/fetch.vue
vendored
2
test/fixtures/ssr/pages/fetch.vue
vendored
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<foobar>{{$store.__id}}</foobar>
|
||||
<foobar>{{ $store.__id }}</foobar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
6
test/fixtures/ssr/pages/store.vue
vendored
6
test/fixtures/ssr/pages/store.vue
vendored
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<foobar>
|
||||
{{$store.state[$route.query.onServerInit === '1' ? 'id2': 'id']}}
|
||||
</foobar>
|
||||
<foobar>
|
||||
{{ $store.state[$route.query.onServerInit === '1' ? 'id2': 'id'] }}
|
||||
</foobar>
|
||||
</template>
|
||||
@ -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>
|
||||
|
||||
@ -18,4 +18,3 @@ body {
|
||||
font-family: 'Roboto';
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
1
test/fixtures/with-config/pages/desktop.vue
vendored
1
test/fixtures/with-config/pages/desktop.vue
vendored
@ -9,4 +9,3 @@ export default {
|
||||
layout: 'desktop/default'
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
1
test/fixtures/with-config/pages/mobile.vue
vendored
1
test/fixtures/with-config/pages/mobile.vue
vendored
@ -9,4 +9,3 @@ export default {
|
||||
layout: 'mobile/default'
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
34
yarn.lock
34
yarn.lock
@ -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"
|
||||
|
||||
Loading…
Reference in New Issue
Block a user