vue demo

+exports.index = (req, res) => {
+    res.render('demo/index', {
+        vue: true
+    });
+};

@@ -9,6 +9,7 @@
 const router = require('express').Router(); // eslint-disable-line
 const cRoot = './controllers';
 
+const demo = require(`${cRoot}/demo`);
 const coupon = require(`${cRoot}/coupon`);
 const wechat = require(`${cRoot}/wechat`);
 const student = require(`${cRoot}/student`);
@@ -22,6 +23,8 @@ const coin = require(`${cRoot}/coin`);
 
 // routers
 
+router.get('/demo', demo.index);
+
 router.get('/coupon', coupon.index);
 
 router.get('/coupon/phone', coupon.getCoupon);

+<div id="app">
+    <app></app>
+</div>

@@ -31,7 +31,7 @@
             {{/if}}
 
             {{#if vue}}
-                <link rel="stylesheet" href="/{{devHost}}:5001/{{module}}.{{page}}.css">
+                <link rel="stylesheet" href="//{{devHost}}:5001/{{module}}.{{page}}.css">
             {{/if}}
         {{^}}
             {{#if shopPage}}

@@ -83,6 +83,7 @@
     "stylelint": "^7.1.0",
     "stylelint-config-yoho": "^1.2.7",
     "stylelint-processor-html": "^1.0.0",
+    "vue": "^2.0.3",
     "vue-loader": "^9.7.0",
     "webpack": "^1.13.2",
     "webpack-dashboard": "^0.2.0",

+let Vue = require('vue');
+
+let app = require('activity/demo/index.vue');
+
+new Vue({
+    el: '#app',
+    components: {
+        app: app
+    }
+});
+

+<template>
+    <div>{{msg}}</div>
+</template>
+
+<script>
+    module.exports = {
+        data() {
+            return {
+                msg: 'app'
+            }
+        }
+    }
+</script>
+
+<style>
+    #app {
+        color: green;
+    }
+</style>

@@ -59,7 +59,8 @@ module.exports = {
         modulesDirectories: ['node_modules', './vue', './hbs', './scss', './js'],
         alias: {
             js: path.join(__dirname, 'js/'),
-            template: path.join(__dirname, './hbs')
+            template: path.join(__dirname, './hbs'),
+            vue: 'vue/dist/vue.js'
         }
     },
     plugins: [