From e8c6686f03c2bf07f366393db3a6605c501e230b Mon Sep 17 00:00:00 2001
From: Ali Torki <ali_4286@live.com>
Date: Mon, 17 Sep 2018 09:23:23 +0430
Subject: [PATCH] add: users & books route and use dynamic syntax import

---
 .babelrc                 |  1 +
 package.json             |  1 +
 src/components/books.vue | 20 ++++++++++++++++++++
 src/components/home.vue  | 14 --------------
 src/components/users.vue | 20 ++++++++++++++++++++
 src/router/index.js      | 14 ++++++++++++--
 6 files changed, 54 insertions(+), 16 deletions(-)
 create mode 100644 src/components/books.vue
 create mode 100644 src/components/users.vue

diff --git a/.babelrc b/.babelrc
index e7e7b14..a3f2d08 100644
--- a/.babelrc
+++ b/.babelrc
@@ -12,6 +12,7 @@
     "stage-2"
   ],
   "plugins": [
+    "syntax-dynamic-import",
     "transform-vue-jsx",
     "transform-runtime",
     [
diff --git a/package.json b/package.json
index 60a917f..bd0d9f2 100644
--- a/package.json
+++ b/package.json
@@ -24,6 +24,7 @@
     "babel-helper-vue-jsx-merge-props": "^2.0.3",
     "babel-loader": "^7.1.1",
     "babel-plugin-component": "^1.1.1",
+    "babel-plugin-syntax-dynamic-import": "^6.18.0",
     "babel-plugin-syntax-jsx": "^6.18.0",
     "babel-plugin-transform-runtime": "^6.22.0",
     "babel-plugin-transform-vue-jsx": "^3.5.0",
diff --git a/src/components/books.vue b/src/components/books.vue
new file mode 100644
index 0000000..a3d92ff
--- /dev/null
+++ b/src/components/books.vue
@@ -0,0 +1,20 @@
+<template>
+  <el-main>
+    <h2>Books</h2>
+    <el-main>
+
+    </el-main>
+  </el-main>
+</template>
+
+<style>
+</style>
+
+<script>
+export default {
+  name: 'Books'
+}
+</script>
+
+<style scoped>
+</style>
diff --git a/src/components/home.vue b/src/components/home.vue
index 526c725..ee24d44 100644
--- a/src/components/home.vue
+++ b/src/components/home.vue
@@ -30,18 +30,4 @@ export default {
 </script>
 
 <style scoped>
-p {
-  line-height: 1.5;
-  font-size: 1.2em;
-}
-ul > li {
-  list-style-type: none;
-  font-size: 1.2em;
-  line-height: 1.8;
-  background: #f5ebff;
-  color: #9d4de7;
-  padding: 10px 20px;
-  margin-bottom: 10px;
-  border-radius: 5px;
-}
 </style>
diff --git a/src/components/users.vue b/src/components/users.vue
new file mode 100644
index 0000000..0844d62
--- /dev/null
+++ b/src/components/users.vue
@@ -0,0 +1,20 @@
+<template>
+  <el-main>
+    <h2>Users</h2>
+    <el-main>
+
+    </el-main>
+  </el-main>
+</template>
+
+<style>
+</style>
+
+<script>
+export default {
+  name: 'Users'
+}
+</script>
+
+<style scoped>
+</style>
diff --git a/src/router/index.js b/src/router/index.js
index f7f4f42..0a1ed27 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,10 +1,10 @@
 import Vue from 'vue'
 import Router from 'vue-router'
-import home from '@/components/home'
 
 Vue.use(Router)
 
 export default new Router({
+  mode: 'history',
   scrollBehavior(to, from, savedPosition) {
     if (savedPosition) {
       return savedPosition
@@ -16,7 +16,17 @@ export default new Router({
     {
       path: '/',
       name: 'Home',
-      component: home
+      component: () => import('@/components/home')
+    },
+    {
+      path: '/users',
+      name: 'Users',
+      component: () => import('@/components/users')
+    },
+    {
+      path: '/books',
+      name: 'Books',
+      component: () => import('@/components/books')
     }
   ]
 })