├── README.md
├── meta.js
└── template
    ├── .editorconfig
    ├── .eslintrc.js
    ├── .gitignore
    ├── README.md
    ├── assets
        ├── css
        │   └── main.css
        └── img
        │   └── logo.png
    ├── backpack.config.js
    ├── components
        └── Footer.vue
    ├── layouts
        ├── default.vue
        └── error.vue
    ├── nuxt.config.js
    ├── package.json
    ├── pages
        ├── about.vue
        └── index.vue
    ├── server
        └── index.js
    └── static
        └── favicon.ico


/README.md:
--------------------------------------------------------------------------------
 1 | # Nuxt.js with Koa
 2 | 
 3 | > [KoaJS](http://koajs.com/) + [Nuxt.js](https://nuxtjs.org) = :zap:
 4 | 
 5 | ## Installation
 6 | 
 7 | This is a project template for [vue-cli](https://github.com/vuejs/vue-cli).
 8 | 
 9 | ```bash
10 | vue init nuxt-community/koa-template <project-name>
11 | cd <project-name> # move to your project
12 | npm install # or yarn install*[see note below]
13 | ```
14 | 
15 | > Make sure to use a version of vue-cli >= 2.1 (vue -V).
16 | 
17 | *Note: Due to a bug in yarn's engine version detection code if you are
18 | using a prerelease version of Node (i.e. v7.6.0-rc.1) you will need to either:
19 | 
20 |   1. Use `npm install`
21 |   2. Run `yarn` with a standard release of Node and then switch back
22 | 
23 | ## Commands
24 | 
25 | | Command | Description |
26 | |---------|-------------|
27 | | npm run dev | Start KoaJS server in development with Nuxt.js in dev mode (hot reloading). Listen on [http://localhost:3000](http://localhost:3000). |
28 | | npm run build | Build the nuxt.js web application for production. |
29 | | npm start | Start KoaJS server in production. |
30 | 
31 | 
32 | ## Documentation
33 | 
34 | - [KoaJS](http://koajs.com/)
35 | - [Nuxt.js](https://nuxtjs.org/guide/)
36 | - [Vue.js](http://vuejs.org/guide/)
37 | 
38 | ## Licenses
39 | 
40 | - [KoaJS license](https://github.com/koajs/koa/blob/master/LICENSE)
41 | - [NuxtJS license](https://github.com/nuxt/nuxt.js/blob/master/LICENSE.md)
42 | - [VueJS license](https://github.com/vuejs/vue/blob/master/LICENSE)
43 | 


--------------------------------------------------------------------------------
/meta.js:
--------------------------------------------------------------------------------
 1 | module.exports = {
 2 |   helpers: {
 3 |     raw: function(options) {
 4 |       return options.fn(this)
 5 |     },
 6 |     ifBabel: function(options) {
 7 |       var nodeMajMin = process.version.match(/v(\d*).(\d*)./)
 8 |       var semMaj = Number(nodeMajMin[1])
 9 |       var semMin = Number(nodeMajMin[2])
10 |       var nodeHasAsync = (semMaj === 7 && semMin >= 6) || semMaj >= 8
11 |       return nodeHasAsync ? '' : options.fn(this)
12 |     }
13 |   },
14 |   prompts: {
15 |     name: {
16 |       'type': 'string',
17 |       'required': true,
18 |       'message': 'Project name'
19 |     },
20 |     description: {
21 |       'type': 'string',
22 |       'required': false,
23 |       'message': 'Project description',
24 |       'default': 'Nuxt.js project'
25 |     },
26 |     author: {
27 |       'type': 'string',
28 |       'message': 'Author'
29 |     }
30 |   },
31 |   completeMessage: '{{#inPlace}}To get started:\n\n  npm install # Or yarn\n  npm run dev{{else}}To get started:\n\n  cd {{destDirName}}\n  npm install # Or yarn\n  npm run dev{{/inPlace}}'
32 | };
33 | 


--------------------------------------------------------------------------------
/template/.editorconfig:
--------------------------------------------------------------------------------
 1 | root = true
 2 | 
 3 | [*]
 4 |   indent_style = space
 5 |   indent_size = 2
 6 |   end_of_line = lf
 7 |   charset = utf-8
 8 |   trim_trailing_whitespace = true
 9 |   insert_final_newline = true
10 | 
11 | [*.md]
12 |   trim_trailing_whitespace = false
13 | 


--------------------------------------------------------------------------------
/template/.eslintrc.js:
--------------------------------------------------------------------------------
 1 | module.exports = {
 2 |   root: true,
 3 |   parser: 'babel-eslint',
 4 |   env: {
 5 |     browser: true,
 6 |     node: true
 7 |   },
 8 |   extends: 'standard',
 9 |   // required to lint *.vue files
10 |   plugins: [
11 |     'html'
12 |   ],
13 |   // add your custom rules here
14 |   rules: {
15 |     'space-before-function-paren': [
16 |       2,
17 |       {
18 |         anonymous: 'always',
19 |         named: 'never'
20 |       }
21 |     ],
22 |   },
23 |   globals: {}
24 | }
25 | 


--------------------------------------------------------------------------------
/template/.gitignore:
--------------------------------------------------------------------------------
 1 | # dependencies
 2 | node_modules
 3 | 
 4 | # logs
 5 | npm-debug.log
 6 | 
 7 | # Nuxt build
 8 | .nuxt
 9 | 
10 | # Nuxt generate
11 | dist
12 | 


--------------------------------------------------------------------------------
/template/README.md:
--------------------------------------------------------------------------------
 1 | # {{ name }}
 2 | 
 3 | > {{ description }}
 4 | 
 5 | ## Build Setup
 6 | 
 7 | ``` bash
 8 | # install dependencies
 9 | $ npm install # Or yarn install*[see note below]
10 | 
11 | # serve with hot reload at localhost:3000
12 | $ npm run dev
13 | 
14 | # build for production and launch server
15 | $ npm run build
16 | $ npm start
17 | 
18 | # generate static project
19 | $ npm run generate
20 | ```
21 | 
22 | *Note: Due to a bug in yarn's engine version detection code if you are
23 | using a prerelease version of Node (i.e. v7.6.0-rc.1) you will need to either:
24 |   1. Use `npm install`
25 |   2. Run `yarn` with a standard release of Node and then switch back
26 | 
27 | For detailed explanation on how things work, checkout the [Nuxt.js docs](https://github.com/nuxt/nuxt.js).
28 | 


--------------------------------------------------------------------------------
/template/assets/css/main.css:
--------------------------------------------------------------------------------
 1 | html, body
 2 | {
 3 |   background-color: #fff;
 4 |   color: #2e2f30;
 5 |   letter-spacing: 0.5px;
 6 |   font-family: "Source Sans Pro", Arial, sans-serif;
 7 |   height: 100vh;
 8 |   margin: 0;
 9 | }
10 | 
11 | footer
12 | {
13 |   padding: 20px;
14 |   text-align: center;
15 |   border-top: 1px solid #ddd;
16 | }
17 | 
18 | a, a:hover, a:focus, a:visited
19 | {
20 |   color: #41B883;
21 | }
22 | 
23 | .logo {
24 |   width: 243px;
25 |   height: 218px;
26 | }
27 | 
28 | .page-enter-active, .page-leave-active
29 | {
30 |   transition: opacity .5s
31 | }
32 | .page-enter, .page-leave-active
33 | {
34 |   opacity: 0
35 | }
36 | 


--------------------------------------------------------------------------------
/template/assets/img/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/nuxt-community/koa-template/c58842326338dba4af5c84e807fd0159ce4f7fc8/template/assets/img/logo.png


--------------------------------------------------------------------------------
/template/backpack.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   webpack: (config, options, webpack) => {
3 |     config.entry.main = './server/index.js'
4 |     return config
5 |   }
6 | }
7 | 


--------------------------------------------------------------------------------
/template/components/Footer.vue:
--------------------------------------------------------------------------------
1 | <template>
2 |   <footer>
3 |     Visit our website for more documentation : <a href="https://nuxtjs.org" target="_blank">nuxtjs.org</a>
4 |   </footer>
5 | </template>
6 | 


--------------------------------------------------------------------------------
/template/layouts/default.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <div>
 3 |     <nuxt/>
 4 |     <my-footer/>
 5 |   </div>
 6 | </template>
 7 | 
 8 | <script>
 9 | import MyFooter from '../components/Footer.vue'
10 | 
11 | export default {
12 |   components: {
13 |     MyFooter
14 |   }
15 | }
16 | </script>
17 | 
18 | <style>
19 | .container
20 | {
21 |   margin: 0;
22 |   width: 100%;
23 |   padding: 100px 0;
24 |   text-align: center;
25 | }
26 | 
27 | .button, .button:visited
28 | {
29 |   display: inline-block;
30 |   color: #3B8070;
31 |   letter-spacing: 1px;
32 |   background-color: #fff;
33 |   border: 2px solid #3B8070;
34 |   text-decoration: none;
35 |   text-transform: uppercase;
36 |   padding: 15px 45px;
37 | }
38 | 
39 | .button:hover, .button:focus
40 | {
41 |   color: #fff;
42 |   background-color: #3B8070;
43 | }
44 | 
45 | .title
46 | {
47 |   color: #505153;
48 |   font-weight: 300;
49 |   font-size: 2.5em;
50 |   margin: 0;
51 | }
52 | </style>
53 | 


--------------------------------------------------------------------------------
/template/layouts/error.vue:
--------------------------------------------------------------------------------
 1 | {{{{raw}}}}
 2 | <template>
 3 |   <section class="container">
 4 |     <img src="../assets/img/logo.png" alt="Nuxt.js Logo" />
 5 |     <h1 class="title">
 6 |       {{ error.statusCode }}
 7 |     </h1>
 8 |     <h2 class="info">
 9 |       {{ error.message }}
10 |     </h2>
11 |     <nuxt-link class="button" to="/" v-if="error.statusCode === 404">
12 |       Homepage
13 |     </nuxt-link>
14 |   </section>
15 | </template>
16 | {{{{/raw}}}}
17 | <script>
18 | export default {
19 |   props: ['error']
20 | }
21 | </script>
22 | 
23 | <style scoped>
24 | .title
25 | {
26 |   margin-top: 15px;
27 |   font-size: 5em;
28 | }
29 | .info
30 | {
31 |   font-weight: 300;
32 |   color: #9aabb1;
33 |   margin: 0;
34 | }
35 | .button
36 | {
37 |   margin-top: 50px;
38 | }
39 | </style>
40 | 


--------------------------------------------------------------------------------
/template/nuxt.config.js:
--------------------------------------------------------------------------------
 1 | module.exports = {
 2 |   /*
 3 |   ** Headers of the page
 4 |   */
 5 |   head: {
 6 |     title: 'starter',
 7 |     meta: [
 8 |       { charset: 'utf-8' },
 9 |       { name: 'viewport', content: 'width=device-width, initial-scale=1' },
10 |       { hid: 'description', name: 'description', content: 'Nuxt.js project' }
11 |     ],
12 |     link: [
13 |       { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
14 |     ]
15 |   },
16 |   /*
17 |   ** Global CSS
18 |   */
19 |   css: ['~assets/css/main.css'],
20 |   /*
21 |   ** Customize the progress-bar color
22 |   */
23 |   loading: { color: '#3B8070' },
24 |   /*
25 |    ** Build configuration
26 |    */
27 |   build: {
28 |     /*
29 |      ** Run ESLINT on save
30 |      */
31 |     extend (config, ctx) {
32 |       if (ctx.isClient) {
33 |         config.module.rules.push({
34 |           enforce: 'pre',
35 |           test: /\.(js|vue)$/,
36 |           loader: 'eslint-loader',
37 |           exclude: /(node_modules)/
38 |         })
39 |       }
40 |     }
41 |   }
42 | }
43 | 


--------------------------------------------------------------------------------
/template/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "{{ name }}",
 3 |   "version": "1.1.0",
 4 |   "description": "{{ description }}",
 5 |   "author": "{{ author }}",
 6 |   "private": true,
 7 |   "scripts": {
 8 |     "dev": "backpack dev",
 9 |     "build": "nuxt build && backpack build",
10 |     "start": "cross-env NODE_ENV=production node build/main.js",
11 |     "precommit": "npm run lint",
12 |     "lint": "eslint --ext .js,.vue --ignore-path .gitignore ."
13 |   },
14 |   "dependencies": {
15 |     "cross-env": "^5.0.1",
16 |     "koa": "^2.4.1",
17 |     "nuxt": "latest",
18 |     "source-map-support": "^0.4.15"
19 |   },
20 |   "devDependencies": {
21 |     "babel-eslint": "^7.1.1",
22 |     "backpack-core": "^0.3.0",
23 |     "eslint": "^3.13.1",
24 |     "eslint-loader": "^1.9.0",
25 |     "eslint-config-standard": "^10.2.1",
26 |     "eslint-plugin-html": "^2.0.3",
27 |     "eslint-plugin-import": "^2.2.0",
28 |     "eslint-plugin-node": "^4.2.2",
29 |     "eslint-plugin-promise": "^3.4.0",
30 |     "eslint-plugin-standard": "^3.0.1",
31 |     "nodemon": "^1.11.0",
32 |     "scmp": "^2.0.0"
33 |   }
34 | }
35 | 


--------------------------------------------------------------------------------
/template/pages/about.vue:
--------------------------------------------------------------------------------
 1 | {{{{raw}}}}
 2 | <template>
 3 |   <section class="container">
 4 |     <img src="../assets/img/logo.png" alt="Nuxt.js Logo" class="logo" />
 5 |     <h1 class="title">
 6 |       This page is loaded from the {{ name }}
 7 |     </h1>
 8 |     <h2 class="info" v-if="name === 'client'">
 9 |       Please refresh the page
10 |     </h2>
11 |     <nuxt-link class="button" to="/">
12 |       Home page
13 |     </nuxt-link>
14 |   </section>
15 | </template>
16 | {{{{/raw}}}}
17 | <script>
18 | export default {
19 |   asyncData({ req }) {
20 |     return {
21 |       name: req ? 'server' : 'client'
22 |     }
23 |   },
24 |   head() {
25 |     return {
26 |       title: `About Page (${this.name}-side)`
27 |     }
28 |   }
29 | }
30 | </script>
31 | 
32 | <style scoped>
33 | .title
34 | {
35 |   margin-top: 50px;
36 | }
37 | .info
38 | {
39 |   font-weight: 300;
40 |   color: #9aabb1;
41 |   margin: 0;
42 |   margin-top: 10px;
43 | }
44 | .button
45 | {
46 |   margin-top: 50px;
47 | }
48 | </style>
49 | 


--------------------------------------------------------------------------------
/template/pages/index.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <section class="container">
 3 |     <img src="../assets/img/logo.png" alt="Nuxt.js Logo" class="logo" />
 4 |     <h1 class="title">
 5 |       Universal Vue.js Application Framework
 6 |     </h1>
 7 |     <nuxt-link class="button" to="/about">
 8 |       About page
 9 |     </nuxt-link>
10 |   </section>
11 | </template>
12 | 
13 | <style scoped>
14 | .title
15 | {
16 |   margin: 50px 0;
17 | }
18 | </style>
19 | 


--------------------------------------------------------------------------------
/template/server/index.js:
--------------------------------------------------------------------------------
 1 | import Koa from 'koa'
 2 | import { Nuxt, Builder } from 'nuxt'
 3 | 
 4 | async function start () {
 5 |   const app = new Koa()
 6 |   const host = process.env.HOST || '127.0.0.1'
 7 |   const port = process.env.PORT || 3000
 8 | 
 9 |   // Import and Set Nuxt.js options
10 |   const config = require('../nuxt.config.js')
11 |   config.dev = !(app.env === 'production')
12 | 
13 |   // Instantiate nuxt.js
14 |   const nuxt = new Nuxt(config)
15 | 
16 |   // Build in development
17 |   if (config.dev) {
18 |     const builder = new Builder(nuxt)
19 |     await builder.build()
20 |   }
21 | 
22 |   app.use(ctx => {
23 |     ctx.status = 200
24 |     ctx.respond = false // Mark request as handled for Koa
25 |     ctx.req.ctx = ctx // This might be useful later on, e.g. in nuxtServerInit or with nuxt-stash
26 |     nuxt.render(ctx.req, ctx.res)
27 |   })
28 | 
29 |   app.listen(port, host)
30 |   console.log('Server listening on ' + host + ':' + port) // eslint-disable-line no-console
31 | }
32 | 
33 | start()
34 | 


--------------------------------------------------------------------------------
/template/static/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/nuxt-community/koa-template/c58842326338dba4af5c84e807fd0159ce4f7fc8/template/static/favicon.ico


--------------------------------------------------------------------------------