support Steps

fixed npm run dev error with  cann't find module vue-template-compiler
update test demo style
:

test/app.vue

@@ -2,26 +2,15 @@
     @import "../src/styles/index.less";
 </style>
 <style scoped>
-nav {
-    margin-bottom: 40px;
-}
-
-li {
-    display: inline-block;
-}
-
-li + li {
-    border-left: solid 1px #bbb;
-    padding-left: 5px;
-    margin-left: 5px;
-}
-
-.v-link-active {
-    color: #bbb;
-}
+nav { margin-bottom: 40px; }
+ul { display: flex; flex-wrap: wrap; }
+li { display: inline-block; }
+li + li { border-left: solid 1px #bbb; padding-left: 10px; margin-left: 10px; }
+.container{ padding: 10px 40px; }
+.v-link-active { color: #bbb; }
 </style>
 <template>
-    <div>
+    <div class="container">
         <nav>
             <ul>
                 <li><router-link to="/affix">Affix</router-link></li>
@@ -30,6 +19,7 @@ li + li {
                 <li><router-link to="/input">Input</router-link></li>
                 <li><router-link to="/radio">Radio</router-link></li>
                 <li><router-link to="/checkbox">Checkbox</router-link></li>
+                <li><router-link to="/steps">Steps</router-link></li>
             </ul>
         </nav>
         <router-view></router-view>

test/main.js

@@ -40,6 +40,10 @@ const router = new VueRouter({
         {
             path: '/checkbox',
             component: require('./routers/checkbox.vue')
+        },
+        {
+          path: '/steps',
+          component: require('./routers/steps.vue')
         }
     ]
 });

test/routers/steps.vue

@@ -1,7 +1,5 @@
-<style>
-
-</style>
 <template>
+<div>
     <Steps :current="1" size="small">
         <Step title="已完成" content="这里是该步骤的描述信息这里是该步骤的描述信息这里是该步骤的描述信息"></Step>
         <Step title="进行中" content="这里是该步骤的描述信息"></Step>
@@ -41,8 +39,9 @@
         <Step title="步骤3"></Step>
         <Step title="步骤4"></Step>
     </Steps>
-    <i-button type="primary" @click="next">下一步</i-button>
-    <br><br>
+    <br>
+    <Button type="primary" @click.native="next">下一步</Button>
+    <br><br><br>
     <Steps :current="1" direction="vertical" size="small">
         <Step title="已完成" content="这里是该步骤的描述信息这里是该步骤的描述信息这里是该步骤的描述信息"></Step>
         <Step title="进行中" content="这里是该步骤的描述信息"></Step>
@@ -56,18 +55,18 @@
         <Step title="待进行" content="这里是该步骤的描述信息"></Step>
         <Step title="待进行" content="这里是该步骤的描述信息"></Step>
     </Steps>
+</div>
 </template>
 <script>
-    import { Page, Steps, iButton } from 'iview';
+    import { Steps, Button } from 'iview';
 
     const Step = Steps.Step;
 
     export default {
         components: {
-            Page,
             Steps,
             Step,
-            iButton
+            Button
         },
         props: {
 
@@ -82,9 +81,6 @@
 
         },
         methods: {
-            setPage (page) {
-                console.log(page)
-            },
             next () {
                 if (this.current == 3) {
                     this.current = 0;