include router

faf3c62b · Evan You · 0e4d38c5 · faf3c62b · faf3c62b · faf3c62b
Commit faf3c62b authored Aug 03, 2016 by Evan You
7 changed files
--- a/package.json
+++ b/package.json
@@ -4,7 +4,8 @@
  "author": "Evan You <yyx990803@gmail.com>",
  "private": true,
  "scripts": {
-    "start": "node server",
+    "dev": "node server",
+    "start": "NODE_ENV=production node server",
    "build": "npm run build:client && npm run build:server",
    "build:client": "NODE_ENV=production webpack --config webpack.client.config.js --progress --hide-modules",
    "build:server": "NODE_ENV=production webpack --config webpack.server.config.js  --progress --hide-modules"
@@ -14,7 +15,7 @@
    "serialize-javascript": "^1.3.0",
    "serve-favicon": "^2.3.0",
    "vue": "^2.0.0-beta.6",
-    "vue-router": "^2.0.0-beta.4",
+    "vue-router": "^2.0.0-rc.1",
    "vue-server-renderer": "^2.0.0-beta.6",
    "vuex": "^2.0.0-rc.3"
  },

--- a/server.js
+++ b/server.js
@@ -65,7 +65,13 @@ app.get('*', (req, res) => {
  const renderStream = renderer.renderToStream(context)
  let firstChunk = true
-  res.write('<!DOCTYPE html><body>')
+  res.write(`<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>vue-hackernews-2.0</title>
+  </head>
+  <body>`)
  renderStream.on('data', chunk => {
    if (firstChunk) {
@@ -81,7 +87,7 @@ app.get('*', (req, res) => {
  })
  renderStream.on('end', () => {
-    res.end(`<script src="/dist/client-bundle.js"></script></body>`)
+    res.end(`<script src="/dist/client-bundle.js"></script></body></html>`)
  })
  renderStream.on('error', err => {

--- a/src/App.vue
+++ b/src/App.vue
@@ -2,6 +2,11 @@
  <div id="app">
    <img src="./assets/logo.png">
    <h1>{{ msg }}</h1>
+    <ul>
+      <li><router-link to="/">News</router-link></li>
+      <li><router-link to="/about">About</router-link></li>
+    </ul>
+    <router-view></router-view>
  </div>
 </template>

--- a/src/app.js
+++ b/src/app.js
 import Vue from 'vue'
+import Router from 'vue-router'
 import App from './App.vue'
+import News from './views/News.vue'
+import About from './views/About.vue'
+Vue.use(Router)
+export const router = new Router({
+  mode: 'history',
+  routes: [
+    { path: '/', component: News },
+    { path: '/about', component: About }
+  ]
+})
 export const app = new Vue({
+  router,
  render: h => h(App)
 })
--- a/src/server-entry.js
+++ b/src/server-entry.js
-import { app } from './app'
+import { app, router } from './app'
-export default app
+export default context => {
+  router.setInitialLocation(context.url)
+  return app
+}
--- a/src/views/About.vue
+++ b/src/views/About.vue
+<template>
+  <div>
+    <h2>About</h2>
+    <p>hohoho</p>
+  </div>
+</template>
--- a/src/views/News.vue
+++ b/src/views/News.vue
+<template>
+  <div>
+    <h2>News</h2>
+    <p>hihihi</p>
+  </div>
+</template>