More Related Content Similar to About Nuxt.js (20) More from kasikasikasi (12) About Nuxt.js7. 全部?入りだよ
• Vue 2
• Vue-Router
• Vuex(Vuex ストアのオプション を利用しているときに限ります)
• Vue Server Renderer(mode: 'spa' を利用しているときを除く)
• Vue-Meta
• Webpack
• vue-loader
• babel-loader など
8. ディレクトリ構造
├── assets
├── components
│ └── AppLogo.vue
├── layouts
│ └── default.vue
├── middleware
├── node_modules
├── nuxt.config.js
├── package-lock.json
├── package.json
├── pages
│ └── index.vue
├── plugins
├── static
│ └── favicon.ico
└── store
21. Nuxt.js(Vue.js) は非エンジニアに
もわかりやすいソースコード
<template>
<section class="container">
<div>
<app-logo/>
<h1 class="title">
nuxt-sample
</h1>
</div>
</section>
</template>
<script>
import AppLogo from '~/components/AppLogo.vue'
export default {
components: {
AppLogo
}
}
</script>
<style>
.container {
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}
.title {
font-family: "Quicksand", "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; /* 1 */
display: block;
font-weight: 300;