vue.js = vue.common.js + compiler.js，默认package.json的main是指向vue.common…

….js，而template 属性的使用一定要用compiler.js，因此需要在alias改变vue指向

assets/component/timeline.vue

@@ -3,7 +3,7 @@
 		template(v-if="list.length > 0")
 			div.line
 			ul
-				li(v-for="(item, index) in list", :style="{marginLeft: (index+1) % 2 === 0 ? liEvenStyle : '0'}", :key="item.id")
+				li(v-for="(item, index) in list", :style="{marginLeft: (index+1) % 2 === 0 ? liEvenStyle : '0'}", :key="item.id", @click="detail(item.id)")
 					span.circle(:style="{backgroundColor: '#' + (item.colorHex ? item.colorHex : 'f5f5f5'), borderColor: '#' + (item.colorHex ? item.colorHex : '808080')}")
 						i.fa(:style="{color: '#' + (item.colorHex ? 'fff' : '808080')}", :class="'fa-' + computedType(item)")
 					div.item-container
@@ -87,6 +87,11 @@
     				}
     			}
     			return false;
+        	},
+        	detail(id){
+        		if(id){
+        			this.$router.push({ path: 'detail', query: { id: id }});
+        		}
         	}
         },
         computed: {
@@ -124,6 +129,7 @@
 		}
 		ul{
 			li{
+				cursor: pointer;
 				box-sizing: border-box;
 				position: relative;
 				width: 100%;

assets/modules/diary/detail.vue

@@ -0,0 +1,16 @@
+<template lang="jade">
+	div.detail 我是日记详情
+</template>
+<script>
+    import Vue from 'vue'
+    export default{
+        name: 'diarydetail',
+        mounted(){
+        	console.log(this.$route.query.id);
+        },
+        components: {}
+    }
+</script>
+<style lang="sass">
+	@import "../../public/scss/index.scss";
+</style>

assets/modules/diary/edit.vue

@@ -0,0 +1,157 @@
+<template lang="jade">
+	div.wuji-container.center-block
+		vue-html5-editor(:content="content", :height="500")
+</template>
+<script>
+    import Vue from 'vue'
+	Vue.use(VueHtml5Editor, {
+	    // 全局组件名称，使用new VueHtml5Editor(options)时该选项无效 
+	    // global component name
+	    name: "vue-html5-editor",
+	    // 是否显示模块名称，开启的话会在工具栏的图标后台直接显示名称
+	    // if set true,will append module name to toolbar after icon
+	    showModuleName: false,
+	    // 自定义各个图标的class，默认使用的是font-awesome提供的图标
+	    // custom icon class of built-in modules,default using font-awesome
+	    icons: {
+	        text: "fa fa-pencil",
+	        color: "fa fa-paint-brush",
+	        font: "fa fa-font",
+	        align: "fa fa-align-justify",
+	        list: "fa fa-list",
+	        link: "fa fa-chain",
+	        unlink: "fa fa-chain-broken",
+	        tabulation: "fa fa-table",
+	        image: "fa fa-file-image-o",
+	        hr: "fa fa-minus",
+	        eraser: "fa fa-eraser",
+	        undo: "fa-undo fa",
+	        "full-screen": "fa fa-arrows-alt",
+	        info: "fa fa-info",
+	    },
+	    // 配置图片模块
+	    // config image module
+	    image: {
+	        // 后端图片上传的地址，如果为空，默认转图片为base64
+	        // Url of the server-side,default null and convert image to base64
+	        server: null,
+	        // 请求时表单参数名
+	        // the name for file field in multipart request
+	        fieldName: "image",
+	        // 文件最大体积，单位字节  max file size
+	        sizeLimit: 512 * 1024,
+	        // 是否压缩，默认true，设置为true时会使用localResizeIMG进行压缩
+	        // default true,if set to true,the image will resize by localResizeIMG (https://github.com/think2011/localResizeIMG)
+	        compress: true,
+	        // 图片压缩选项
+	        // follows are options of localResizeIMG
+	        width: 1600,
+	        height: 1600,
+	        quality: 80,
+	        // 响应数据处理
+	        // handle response data，return image url
+	        uploadHandler(responseText){
+	            //default accept json data like  {ok:false,msg:"unexpected"} or {ok:true,data:"image url"}
+	            var json = JSON.parse(responseText)
+	            if (!json.ok) {
+	                alert(json.msg)
+	            } else {
+	                return json.data
+	            }
+	        }
+	    },
+	    // 语言，内建的有英文（en-us）和中文（zh-cn）
+	    //default en-us, en-us and zh-cn are built-in
+	    language: "zh-cn",
+	    // 自定义语言
+	    i18n: {
+	        //specify your language here
+	        "zh-cn": {
+	            "align": "对齐方式",
+	            "image": "图片",
+	            "list": "列表",
+	            "link": "链接",
+	            "unlink": "去除链接",
+	            "table": "表格",
+	            "font": "文字",
+	            "full screen": "全屏",
+	            "text": "排版",
+	            "eraser": "格式清除",
+	            "info": "关于",
+	            "color": "颜色",
+	            "please enter a url": "请输入地址",
+	            "create link": "创建链接",
+	            "bold": "加粗",
+	            "italic": "倾斜",
+	            "underline": "下划线",
+	            "strike through": "删除线",
+	            "subscript": "上标",
+	            "superscript": "下标",
+	            "heading": "标题",
+	            "font name": "字体",
+	            "font size": "文字大小",
+	            "left justify": "左对齐",
+	            "center justify": "居中",
+	            "right justify": "右对齐",
+	            "ordered list": "有序列表",
+	            "unordered list": "无序列表",
+	            "fore color": "前景色",
+	            "background color": "背景色",
+	            "row count": "行数",
+	            "column count": "列数",
+	            "save": "确定",
+	            "upload": "上传",
+	            "progress": "进度",
+	            "unknown": "未知",
+	            "please wait": "请稍等",
+	            "error": "错误",
+	            "abort": "中断",
+	            "reset": "重置"
+	        }
+	    },
+	    // 隐藏不想要显示出来的模块
+	    // the modules you don't want
+	    hiddenModules: [],
+	    // 自定义要显示的模块，并控制顺序
+	    // keep only the modules you want and customize the order.
+	    // can be used with hiddenModules together
+	    visibleModules: [
+	        "text",
+	        "color",
+	        "font",
+	        "align",
+	        "list",
+	        "link",
+	        "unlink",
+	        "tabulation",
+	        "image",
+	        "hr",
+	        "eraser",
+	        "undo",
+	        "full-screen",
+	        "info",
+	    ],
+	    // 扩展模块，具体可以参考examples或查看源码
+	    // extended modules
+	    modules: {
+	        //omit,reference to source code of build-in modules
+	    }
+	});
+    export default{
+        name: 'diarydedit',
+        data(){
+        	return{
+        		content: ''
+        	}
+        },
+        components: {}
+    }
+</script>
+<style lang="sass">
+	@import "../../public/scss/index.scss";
+	$prefix: 'wuji';
+	.#{$prefix}-container{
+	    width: $container-width;
+		text-align: center;
+	}
+</style>

assets/modules/diary/index.vue

@@ -13,7 +13,8 @@ div.wuji-container.center-block
                     span(:class="{active: (activeCategory === category.categoryId) }") ({{category.diaryCount}})
         div.wuji-add
             i.fa.fa-pencil-square-o
-            span 添加日记
+            span
+                router-link(:to = "{ path: 'create' }") 添加日记
     time-line(width="450", :list="diaryFilterList")
 </template>
 <script>