v2.0.0-beta.2

.coveralls.yml

@@ -0,0 +1,2 @@
+service_name: travis-ci
+repo_token: bOzghLfr6hi9xqh8LDKUPB07Q56vdl1YG

.travis.yml

@@ -2,8 +2,7 @@ sudo: required
 language: node_js
 node_js:
   - '8'
+cache: npm
 script:
-  - 'npm run test'
-before_script:
-  - 'sudo chown root /opt/google/chrome/chrome-sandbox'
-  - 'sudo chmod 4755 /opt/google/chrome/chrome-sandbox'
+  - npm test
+  - npm run coveralls

README.md

@@ -1,5 +1,5 @@
 # NutUI 2
-![npm version](https://img.shields.io/npm/v/@nutui/nutui.svg)  [![Build Status](https://api.travis-ci.org/jdf2e/nutui.svg?branch=v2)](https://github.com/jdf2e/nutui/)
+![npm version](https://img.shields.io/npm/v/@nutui/nutui.svg)  [![Build Status](https://api.travis-ci.org/jdf2e/nutui.svg?branch=v2)](https://github.com/jdf2e/nutui/) [![Coverage Status](https://coveralls.io/repos/github/jdf2e/nutui/badge.svg?branch=v2)](https://coveralls.io/github/jdf2e/nutui?branch=v2) ![license](https://img.shields.io/npm/l/@nutui/nutui.svg)
  
 一套移动端轻量级Vue组件库
     
@@ -17,9 +17,9 @@
 * 支持多语言（国际化）
 * 支持 TypeScript
 * 支持服务端渲染（Vue SSR）
-* 配套有基于Webpack的构建工具，可快速创建已内置本组件库的Vue工程
+* 配套有基于Webpack的构建工具，可快速创建已内置本组件库的Vue工程 
 
-> 如需使用 1.x 版本，请指定版本号，如：  `npm i @nutui/nutui@1.3.2 -S`
+> 如需使用 1.x 版本，安装时请指定版本号，如：  `npm i @nutui/nutui@1.3.2 -S`
 
 ## 支持环境
 
@@ -33,9 +33,17 @@
 
 > 你还可以订阅： https://github.com/jdf2e/nutui/releases.atom 来获得稳定版发布的通知。
 
+## 示例
+
+![npm version](http://img13.360buyimg.com/uba/s300x300_jfs/t1/14144/37/3433/5890/5c26d976E7cd98b80/94583409233081cc.jpg)
+
 ## 安装使用
 
-具体安装使用方法请参考 NutUI 官网 http://nutui.jd.com
+具体安装使用方法请参考 NutUI 官网 
+
+http://nutui.jd.com
+
+文档：[2.X](http://nutui.jd.com/default.html#/start) | [1.X](http://nutui.jd.com/1x/index.html#/intro)
 
 ## 链接
 * [意见反馈](https://github.com/jdf2e/nutui/issues)

build/webpack.demo.build.conf.js

@@ -1,6 +1,8 @@
 const webpack = require('webpack');
 const baseConf = require('./webpack.demo.base.conf.js');
 const merge = require('webpack-merge');
+const path = require('path');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
 const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
 const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
 const rimraf = require('rimraf');
@@ -21,7 +23,10 @@ module.exports = merge(baseConf, {
             'process.env': {
                 NODE_ENV: '"production"'
             }
-        })
+        }),
+        new CopyWebpackPlugin([
+            { from: path.join(__dirname, "../sites/demo/asset/img/favicon.ico"), to: path.join(__dirname, "../dist/sites/")}
+        ]),
     ],
     optimization: {
         minimizer: [

build/webpack.disperse.conf.js

@@ -1,5 +1,4 @@
 const webpack = require('webpack');
-const config = require('../package.json');
 const cptConf = require('../src/config.json');
 const webpackBaseConf = require('./webpack.base.conf.js');
 const path = require('path');

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nutui/nutui",
-  "version": "2.0.0-beta.1",
-  "description": "一套移动端轻量级Vue组件库",
+  "version": "2.0.0-beta.2",
+  "description": "一套轻量级移动端Vue组件库",
   "typings": "dist/types/index.d.ts",
   "main": "dist/nutui.js",
   "files": [
@@ -24,8 +24,8 @@
     "build": "npm run build:prod && npm run build:prodmin && npm run build:disp",
     "eslint": "eslint src/packages/**/*.{js,vue}",
     "add": "node scripts/createCptTpl.js",
-    "test": "cross-env NODE_ENV=test  mocha-webpack --webpack-config build/webpack.test.conf.js --require test/setup.js src/packages/*/__test__/**.spec.js",
-    "cover": "cross-env NODE_ENV=test nyc --reporter=lcov --reporter=text npm run test",
+    "test": "cross-env NODE_ENV=test nyc --reporter=lcov --reporter=text  mocha-webpack --webpack-config build/webpack.test.conf.js --require test/setup.js src/packages/*/__test__/**.spec.js",
+    "coveralls": "cat ./coverage/lcov.info | coveralls",
     "test:watch": "npm run test --watch"
   },
   "repository": {
@@ -63,6 +63,7 @@
     "@babel/core": "7.1.2",
     "@babel/plugin-syntax-dynamic-import": "7.0.0",
     "@babel/plugin-transform-runtime": "7.1.0",
+    "istanbul-instrumenter-loader": "^3.0.1",
     "@babel/preset-env": "7.1.0",
     "@nutui/carefree": "^0.4.0",
     "@tweenjs/tween.js": "17.2.0",
@@ -82,6 +83,7 @@
     "chalk": "2.4.1",
     "copy": "0.3.2",
     "copy-webpack-plugin": "4.5.4",
+    "coveralls": "^3.0.2",
     "cross-env": "5.2.0",
     "css-loader": "1.0.0",
     "eslint": "4.19.1",

scripts/md-to-other.js

@@ -98,7 +98,12 @@ function createdFile(output, sorce,ishasCode) {
           <div v-html="content"></div>
         </div>`+ res + '</div></template>' + jsroot;
         var buf = new Buffer(bufs);
-        fs.writeSync(fd, buf, 0, buf.length, 0);
+        if( typeof fd  == 'number'){
+            fs.writeSync(fd, buf, 0, buf.length, 0);
+         }else{
+             console.log(pathSrc,' typeof fd ！= number 请改正文件')
+         }
+       
     })
 }
 function fileDisplay(filePath,outPath,nohead) {

sites/demo/app.js

@@ -4,7 +4,6 @@ import "core-js/modules/es6.array.iterator";
 import Vue from 'vue';
 import App from './App.vue';
 import router from './router';
-import Conf from '../../src/config.json';
 import NutUI from '../../src/nutui';
 // import en from '../../src/locales/lang/en-US';
 // import demoEN from './lang/en-US';
@@ -50,7 +49,7 @@ const app = new Vue({
   template: '<App/>'
 })
 
-Vue.prototype.NUTCONF = Conf;
+//Vue.prototype.NUTCONF = Conf;
 
 
 let pageLoading = app.$toast.loading();

sites/demo/index.html

@@ -4,6 +4,7 @@
 <head>
   <meta charset="utf-8" />
   <meta content="telephone=no" name="format-detection" />
+  <link rel="shortcut icon" href="/favicon.ico">
   <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
   <title>NutUI - 移动端Vue组件库</title>
   <script src="//misc.360buyimg.com/felibs/vue/2.5.16/vue.min.js"></script>

sites/demo/router.js

@@ -1,6 +1,6 @@
 import Vue from 'vue';
 import VueRouter from 'vue-router';
-import Conf from '../../src/config.json';
+import { packages } from '../../src/config.json';
 import vueg from 'vueg';
 import 'vueg/css/transition-min.css';
 
@@ -30,7 +30,7 @@ const routes = [
 ];
 
 //组件示例页面
-Conf.packages.map(item => {
+packages.map(item => {
   if (item.showDemo === false) return;
   const pkgName =  item.name.toLowerCase();
   routes.push({

sites/demo/view/index.vue

@@ -4,17 +4,17 @@
     <div class="version">NutUI 2.0</div>
     <p>NutUI 是一套轻量级移动端Vue组件库。</p>
     <div
-      :class="['demo-list-box',{'unfold':foldStatus[sortIdx]}]"
-      v-for="(sortName,sortIdx) in sorts"
-      :key="sortIdx"
+      :class="['demo-list-box',{'unfold':foldStatus[item]}]"
+      v-for="item in sorts"
+      :key="item"
     >
-      <h4 @click="toggleFold(sortIdx)">
-        {{sortName}}
+      <h4 @click="toggleFold(item)">
+        {{oriSorts[item]}}
         <i></i>
       </h4>
       <ul>
         <template v-for="cpt in packages">
-          <li v-if="cpt.showDemo !== false && cpt.sort == sortIdx" :key="cpt.name">
+          <li v-if="cpt.showDemo !== false && cpt.sort == item" :key="cpt.name">
             <a :href="'./demo.html#/'+cpt.name">
               {{cpt.name}}
               <span>{{cpt.chnName}}</span>
@@ -27,7 +27,7 @@
 </template>
 
 <script>
-import Conf from "../../../src/config.json";
+import { packages,sorts } from "../../../src/config.json";
 export default {
   name: "index",
   data() {
@@ -35,9 +35,9 @@ export default {
       path: "",
       packages: {},
       sortedPackages: [],
-      sorts: [],
-      foldStatus: [],
-      version: ""
+      oriSorts:[],
+      sorts: [1,2,0,3,4,5],
+      foldStatus: []
     };
   },
   methods: {
@@ -47,18 +47,8 @@ export default {
     }
   },
   created() {
-    this.packages = Conf.packages;
-    this.version = Conf.version;
-    //this.sorts = Conf.sorts;
-
-    this.sorts = [
-      "数据录入",
-      "操作反馈",
-      "数据展示",
-      "导航组件",
-      "布局组件",
-      "基础组件"
-    ];
+    this.packages = packages;
+    this.oriSorts = sorts;
     
     this.foldStatus = Array(this.sorts.length)
       .join(",")

sites/doc/app.js

@@ -21,7 +21,6 @@ import 'highlight.js/styles/github.css';
 //import prettify from 'google-code-prettify/src/prettify';
 //import  'google-code-prettify/src/prettify.css';
 //import  'google-code-prettify/styles/sunburst.css';
-import Conf from '../../src/config.json';
  //import qrcode from './qrcode/index.js';
 import codes from 'qrcode';
  //import NutUI from '../../src/nutui.js';
@@ -37,6 +36,7 @@ new Vue({
   router,
   components: { App },
   template: '<App/>'
-})
-Vue.prototype.NUTCONF = Conf;
+});
+
+//Vue.prototype.NUTCONF = Conf;
 

sites/doc/app.vue

@@ -1,106 +1,90 @@
 <template>
- <div>
-  <div v-if="routerName == 'frontcover' || routerName == ''">
-     <router-view ></router-view>
-  </div>
-  <div class="md-swaper" @click="clearSearch" v-else>
-    <div class="hder">
-      <div class="logo">
-        <a href="default.html#/index" class="logo-link"><img src="./asset/css/i/nut.png" alt></a> <span class="version">{{version}}</span>
-      </div>
-      <div class="h-nav">
-        <div class="search-box">
-          <input
-            @focus="onfocus"
-            @input="search"
-            @keyup="choseList"
-            v-model="searchVal"
-            class="search"
-            type="text"
-            placeholder="在NutUI中搜索"
-          >
-          <!-- <transition name="fade"> -->
-            <ul class="search-list" v-if="searchList.length>0">
-              <li :class="searchCurName==item.chnName?'cur':''" @click="checklist(item)" v-for="(item,index) in searchList" :key="index">
-                <router-link :to="{name:item.name}">
-                  {{item.name}}
-                  <span>{{item.chnName}}</span>
-                </router-link>
-              </li>
-            </ul>
-          <!-- </transition> -->
+  <div>
+    <div v-if="routerName == 'frontcover' || routerName == ''">
+      <router-view></router-view>
+    </div>
+    <div class="md-swaper" @click="clearSearch" v-else>
+      <div class="hder">
+        <div class="logo">
+          <a href="#/index" class="logo-link">
+            <img src="./asset/css/i/nut.png" alt>
+          </a>
+          <span class="version">{{version}}</span>
         </div>
-        <ul class="list">
-          <li class="cur">
-            <a href="default.html#/doc">指南</a>
-          </li>        
-          <li>
-            <a class="qrcode demoLink" href="/demo.html#/index" target="_blank">示例             
+        <div class="h-nav">
+          <search/>
+          <ul class="list">
+            <li class="cur">
+              <a href="#/doc">指南</a>
+            </li>
+            <li>
+              <a class="qrcode demoLink" href="/demo.html#/index" target="_blank">
+                示例
                 <a :href="routerName">
-                  <span>请使用手机扫码体验</span><img src="http://img13.360buyimg.com/uba/jfs/t1/14144/37/3433/5890/5c26d976E7cd98b80/94583409233081cc.png" alt="">
+                  <span>请使用手机扫码体验</span>
+                  <img
+                    src="http://img13.360buyimg.com/uba/jfs/t1/14144/37/3433/5890/5c26d976E7cd98b80/94583409233081cc.png"
+                    alt
+                  >
                 </a>
-            </a>
-          </li>
-          <li>
-            <select @change="openwindow">
-                <option value="2">
-                    2.X
-                </option>
-                <option value="1">
-                    1.X
-                </option>
-            </select>
-          </li>
-          <li class="github">
-
-            <a target="_back" href="https://github.com/jdf2e/nutui"></a>
-          </li>
-        </ul>
+              </a>
+            </li>
+            <li>
+              <select @change="openwindow">
+                <option value="2">2.X</option>
+                <option value="1">1.X</option>
+              </select>
+            </li>
+            <li class="github">
+              <a target="_back" href="https://github.com/jdf2e/nutui"></a>
+            </li>
+          </ul>
+        </div>
       </div>
-    </div>
-    <div class="demo-wrapper">
-      <router-view class="demo-nav" name="demonav"></router-view>
+      <div class="demo-wrapper">
+        <router-view class="demo-nav" name="demonav"></router-view>
         <keep-alive include="index">
           <router-view class="doc-cont" name="main"></router-view>
         </keep-alive>
         <div v-if="showPhone" class="showPhone">
           <div class="ph">
             <div class="bg">
-              <img src="./asset/css/i/phtitle.png" alt="">
+              <img src="./asset/css/i/phtitle.png" alt>
               <div>
-                <input type="text" readonly :value="'http://nutui.jd.com/demo.html#/'+routerName">
+                <input type="text" readonly :value="'http://nutui.jd.com/demo.html#/'+routerName+'?ver='+version">
               </div>
             </div>
-            <iframe :src="'/demo.html#/'+routerName"></iframe>
+            <iframe :src="'/demo.html#/'+routerName+'?ver='+version"></iframe>
           </div>
         </div>
-    </div>
-    <div class="foot">Copyright © 2018~2019
-      <a href="//jdc.jd.com" target="_blank">JDC</a>-
-      <a target="_blank" href="http://fe.jd.com/">前端开发部</a>
+      </div>
+      <div class="foot">
+        Copyright © 2018~2019
+        <a href="//jdc.jd.com" target="_blank">JDC</a>-
+        <a target="_blank" href="http://fe.jd.com/">前端开发部</a>
+      </div>
     </div>
   </div>
-  
- </div>
 </template>
 <script>
 import "./asset/css/common.scss";
 import "./asset/css/style-blue.scss";
-import Conf from "../../src/config.json";
-import PackageJson from "../../package.json";
+import { packages } from "../../src/config.json";
+import { version } from "../../package.json";
+import search from "./search.vue";
 export default {
   name: "App",
   data() {
     return {
-      packages: "",
+      packages,
       searchList: [],
       searchVal: "",
       routerName: "",
       showPhone: false,
-      searchCurName:'',
-      searchIndex:0,
-      codeurl:'',
-      version:''
+      searchCurName: "",
+      searchIndex: 0,
+      codeurl: "",
+      version
     };
   },
   watch: {
@@ -111,54 +95,60 @@ export default {
     //  },
     $route: "fetchData"
   },
+  components: {
+    search
+  },
   methods: {
-    openwindow(val){      
-      if(val.target.value==1){
-        window.location.href=" http://nutui.jd.com/1x/"
+    openwindow(val) {
+      if (val.target.value == 1) {
+        window.location.href = " http://nutui.jd.com/1x/";
       }
     },
-    choseList(e){
-      console.log(e)
+    choseList(e) {
       let searchIndex = this.searchIndex;
-      if(e.keyCode==40){
+      if (e.keyCode == 40) {
         searchIndex++;
       }
-      if(e.keyCode==38){
-         searchIndex--;
+      if (e.keyCode == 38) {
+        searchIndex--;
       }
-      if(searchIndex<0){
+      if (searchIndex < 0) {
         searchIndex = 0;
-      }      
+      }
       let searchList = this.searchList;
-      if(searchList.length>0){       
-       let chnName = searchList[searchIndex].chnName;
-       if(chnName){
-         this.searchCurName = chnName;
-         this.searchIndex = searchIndex;
-         if(e.keyCode==13){
-          this.$router.push({
-            path:'/'+searchList[searchIndex].name
-          })
-           this.searchCurName='';
-           this.searchIndex=0;
-           this.searchList=[];
-           this.searchVal='';
+      if (searchList.length > 0) {
+        let chnName = searchList[searchIndex].chnName;
+        if (chnName) {
+          this.searchCurName = chnName;
+          this.searchIndex = searchIndex;
+          if (e.keyCode == 13) {
+            this.$router.push({
+              path: "/" + searchList[searchIndex].name
+            });
+            this.searchCurName = "";
+            this.searchIndex = 0;
+            this.searchList = [];
+            this.searchVal = "";
+          }
         }
-       }       
       }
     },
-    fetchData(obj) {  
+    fetchData(obj) {
       this.routerName = obj.name;
       this.showPhone = false;
-      for (let i = 0, item; (item = Conf.packages[i]); i++) {
+      for (let i = 0, item; (item = packages[i]); i++) {
         if (obj.name == item.name) {
           this.showPhone = true;
         }
       }
       let that = this;
-      this.qrcode.toDataURL('http://nutui.jd.com/index.html#/'+that.routerName,{width:170},(err,url)=>{
-        that.codeurl = url
-      })
+      this.qrcode.toDataURL(
+        "http://nutui.jd.com/index.html#/" + that.routerName,
+        { width: 170 },
+        (err, url) => {
+          that.codeurl = url;
+        }
+      );
     },
     onfocus(e) {
       e.target.select();
@@ -184,21 +174,18 @@ export default {
     checklist(obj) {
       this.searchVal = "";
       this.searchList = [];
-      this.searchCurName='';
-      this.searchIndex=0;
+      this.searchCurName = "";
+      this.searchIndex = 0;
     }
   },
   created() {
     let that = this;
-    this.packages = Conf.packages;   
     let name = this.$route.name;
-    this.version = PackageJson.version; 
-    for (let i = 0, item; (item = Conf.packages[i]); i++) {
+    for (let i = 0, item; (item = packages[i]); i++) {
       if (name == item.name) {
         this.showPhone = true;
       }
     }
-     
   }
 };
 </script>
@@ -231,31 +218,31 @@ export default {
   display: flex;
   align-items: center;
   margin-bottom: 50px;
-  z-index:42;
+  z-index: 42;
   .logo {
-    width: 295px;   
+    width: 295px;
     height: 65px;
     border-right: 1px solid #d8d8d8;
     display: flex;
-    align-items:center;
-    flex-shrink: 0;    
-    .logo-link{
-      display:inline-block;
+    align-items: center;
+    flex-shrink: 0;
+    .logo-link {
+      display: inline-block;
+    }
+    img {
+      display: block;
+      width: 120px;
+      height: 46px;
+      flex-grow: 0;
+      flex-shrink: 0;
+      margin: 0 10px 0 30px;
     }
-    img{
-        display: block;
-        width: 120px;
-        height: 46px;
-        flex-grow: 0;
-        flex-shrink:0;
-         margin: 0 10px 0 30px;
-    }   
-    color:#999;
+    color: #999;
     font-size: 12px;
   }
-  .version{
-    display:inline-block;
-    margin-top:7px;
+  .version {
+    display: inline-block;
+    margin-top: 7px;
     vertical-align: bottom;
   }
 
@@ -264,12 +251,12 @@ export default {
     padding-left: 42px;
     align-items: center;
     width: 100%;
-    select{
-      width:74px;
-      height:28px;
-      margin-top:18px;
-      margin-left:20px;
-      font-size:12px;
+    select {
+      width: 74px;
+      height: 28px;
+      margin-top: 18px;
+      margin-left: 20px;
+      font-size: 12px;
     }
     .search-box {
       height: 22px;
@@ -302,7 +289,7 @@ export default {
       li {
         height: 40px;
         line-height: 40px;
-
+        font-size: 14px;
         a {
           display: inline-block;
           box-sizing: border-box;
@@ -319,12 +306,12 @@ export default {
           }
         }
       }
-      .cur{
-          background: #6096ff;
+      .cur {
+        background: #6096ff;
+        color: #fff;
+        a {
           color: #fff;
-          a {
-            color: #fff;
-          }
+        }
       }
     }
   }
@@ -333,7 +320,7 @@ export default {
     list-style: none;
     margin-left: auto;
     li {
-      padding:0 10px;
+      padding: 0 10px;
       height: 63px;
       line-height: 63px;
       text-align: center;
@@ -365,7 +352,7 @@ export default {
 
 .demo-wrapper {
   display: flex;
-  width:100%;
+  width: 100%;
 
   //padding: 0 20px 0 0;
   .demo-nav {
@@ -373,7 +360,7 @@ export default {
     flex-shrink: 0;
   }
   .showPhone {
-    padding-right:25px;
+    padding-right: 25px;
     //margin-left: 20px;
     width: 375px;
     flex-shrink: 0;
@@ -393,19 +380,19 @@ export default {
         width: 389px;
         height: 612px;
         padding: 5px 5px 5px 5px;
-        box-sizing: border-box;       
+        box-sizing: border-box;
       }
-    }    
+    }
     .bg {
       width: 389px;
       height: 64px;
-      padding-top:5px;
-      background: linear-gradient(rgba(55,55,55,.98),#545456);
+      padding-top: 5px;
+      background: linear-gradient(rgba(55, 55, 55, 0.98), #545456);
       text-align: center;
-      img{
+      img {
         width: 350px;
       }
-      input{           
+      input {
         width: 350px;
         height: 28px;
         line-height: 28px;
@@ -416,9 +403,9 @@ export default {
         white-space: nowrap;
         overflow-x: scroll;
         border: none;
-        margin-top:5px;
+        margin-top: 5px;
         padding: 0 5px;
-        &:focus{
+        &:focus {
           outline: none;
         }
       }
@@ -459,9 +446,9 @@ body {
 }
 .doc-cont {
   padding: 8px 40px 8px 0;
-  margin-left:50px;
+  margin-left: 50px;
   box-sizing: border-box;
-  flex:1;
+  flex: 1;
   min-width: 500px;
 }
 // .button-primary {
@@ -487,22 +474,22 @@ body {
 //   background-color: #33c3f0;
 //   border-color: #33c3f0;
 // }
-.demoLink{
+.demoLink {
   background: #fff;
   position: relative;
   z-index: 99999;
   width: auto;
   height: auto;
-  a{
+  a {
     z-index: 9999;
   }
-  &.qrcode{
-    span{
+  &.qrcode {
+    span {
       line-height: 64px;
     }
-    img{
-      width:150px;
-      height:150px;
+    img {
+      width: 150px;
+      height: 150px;
     }
   }
 }

sites/doc/index.html

@@ -4,7 +4,7 @@
 <head>
   <meta charset="utf-8" />
   <meta content="telephone=no" name="format-detection" />
-
+  <link rel="shortcut icon" href="/favicon.ico">
   <title>NutUI 2.0 - 一款轻量级移动端Vue组件库</title>
   <script src="//misc.360buyimg.com/felibs/vue/2.5.16/vue.min.js"></script>
 </head>

sites/doc/info.vue

@@ -50,7 +50,7 @@
 </div>
 </template>
 <script>
-import Conf from "../../src/config.json";
+import { sorts,packages } from "../../src/config.json";
 export default {
   name: "index",
   data() {
@@ -58,7 +58,6 @@ export default {
       path: "",
       packages: {},
       sortedPackages: [],
-      version: "",
       cur: [],
       curName: ""
     };
@@ -134,13 +133,12 @@ export default {
   },
   created() {
     let nameRt = this.$route.name;
-    let packgs = Conf.packages;
+    let packgs = packages;
     
-    this.cur = Conf.sorts
+    this.cur = sorts
     this.curName = nameRt;
     this.packages = packgs;
-    this.version = Conf.version;
-    this.sorts = Conf.sorts;
+    this.sorts = sorts;
   }
 };
 </script>

sites/doc/router.js

@@ -1,6 +1,6 @@
 import Vue from 'vue';
 import VueRouter from 'vue-router';
-import Conf from '../../src/config.json';
+import { packages } from '../../src/config.json';
 import vueg from 'vueg';
 import 'vueg/css/transition-min.css';
 
@@ -65,7 +65,7 @@ const routes = [
   }
 ];
 //组件md文件展示
-Conf.packages.map(item => {
+packages.map(item => {
   if (item.showDemo === false) return;
   const pkgName =  item.name.toLowerCase();
   routes.push({

sites/doc/search.vue

@@ -0,0 +1,162 @@
+<template>
+  <div class="search-box">
+    <input
+      @focus="onfocus"
+      @keyup="choseList"
+      v-model="searchVal"
+      class="search"
+      type="text"
+      placeholder="搜索组件..."
+    >
+    <!-- <transition name="fade"> -->
+    <ul class="search-list" v-if="searchList.length>0">
+      <li
+        :class="searchCurName==item.name?'cur':''"
+        @click="checklist(item)"
+        v-for="(item,index) in searchList"
+        :key="index"
+      >
+        <router-link :to="{name:item.name}">
+          {{item.name}}
+          <span>{{item.chnName}}</span>
+        </router-link>
+      </li>
+    </ul>
+    <!-- </transition> -->
+  </div>
+</template>
+<script>
+import { packages } from "../../src/config.json";
+export default {
+  data() {
+    return {
+      packages,
+      searchVal: "",
+      searchList: [],
+      searchCurName: "",
+      searchIndex: 0
+    };
+  },
+  watch: {
+    searchVal(sVal) {
+      if (sVal) {
+        this.searchList = this.packages.filter(item => {
+          if (item.showDemo === false) return false;
+          const rx = new RegExp(sVal, "gi");
+          return rx.test(item.name + " " + item.chnName + "" + item.desc);
+        });
+      } else {
+        this.searchCurName = "";
+        this.searchIndex = 0;
+        this.searchList = [];
+      }
+    }
+  },
+  mounted() {
+    document.documentElement.addEventListener("click", this.closelist);
+  },
+  methods: {
+    closelist() {
+      this.searchVal = "";
+      this.searchCurName = "";
+      this.searchIndex = 0;
+    },
+    onfocus(e) {
+      e.target.select();
+    },
+    checklist() {
+      this.searchVal = "";
+      this.searchCurName = "";
+      this.searchIndex = 0;
+    },
+    choseList(e) {
+      let searchIndex = this.searchIndex;
+      if (e.keyCode == 40) {
+        searchIndex++;
+      }
+      if (e.keyCode == 38) {
+        searchIndex--;
+      }
+      if (searchIndex < 0) {
+        searchIndex = 0;
+      }
+      let searchList = this.searchList;
+      if (searchList.length > 0) {
+        let chnName = searchList[searchIndex] && searchList[searchIndex].name;
+
+        if (chnName) {
+          this.searchCurName = chnName;
+          this.searchIndex = searchIndex;
+          if (e.keyCode == 13) {
+            this.$router.push({
+              path: "/" + searchList[searchIndex].name
+            });
+            this.searchCurName = "";
+            this.searchIndex = 0;
+            this.searchVal = "";
+          }
+        }
+      }
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+.search-box {
+  height: 22px;
+  min-width: 300px;
+  position: relative;
+  input {
+    width: 100%;
+  }
+}
+.search {
+  height: 22px;
+  font-size: 14px;
+  color: #666;
+  border: none;
+  background: url(./asset/css/i/sreach.png) no-repeat left center;
+  padding-left: 45px;
+  &:focus {
+    outline: none;
+  }
+}
+.search-list {
+  background: #fff;
+  position: absolute;
+  width: 300px;
+  list-style: none;
+  border: 1px solid #f2f2f2;
+  z-index: 99999;
+  top: 27px;
+  padding: 0;
+  li {
+    height: 40px;
+    line-height: 40px;
+    font-size: 12px;
+    a {
+      display: inline-block;
+      box-sizing: border-box;
+      width: 100%;
+      padding-left: 40px;
+      text-decoration: none;
+      color: #666;
+    }
+    &:hover {
+      background: #6096ff;
+      color: #fff;
+      a {
+        color: #fff;
+      }
+    }
+  }
+  .cur {
+    background: #6096ff;
+    color: #fff;
+    a {
+      color: #fff;
+    }
+  }
+}
+</style>
+

src/config.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.1",
+  "version": "2.0.0",
   "sorts": [
     "数据展示",
     "数据录入",
@@ -10,26 +10,6 @@
   ],
   "packages": [
     {
-      "name": "Switch",
-      "version": "1.0.0",
-      "sort": "1",
-      "chnName": "开关",
-      "type": "component",
-      "showDemo": true,
-      "desc": "一种滑动开关，通过点击使按钮左右滑动，同时触发对应的开关状态",
-      "author": "Frans"
-    },
-    {
-      "name": "Radio",
-      "version": "1.0.0",
-      "sort": "1",
-      "chnName": "单选按钮",
-      "type": "component",
-      "showDemo": true,
-      "desc": "单选按钮，可组合成单选按钮组",
-      "author": "Frans"
-    },
-    {
       "name": "Cell",
       "version": "1.0.0",
       "sort": "4",
@@ -81,16 +61,6 @@
     },
     {
       "version": "1.0.0",
-      "name": "CheckBox",
-      "sort": "1",
-      "chnName": "复选按钮",
-      "desc": "复选多个选项",
-      "type": "component",
-      "showDemo": true,
-      "author": "Vicky.Ye"
-    },
-    {
-      "version": "1.0.0",
       "name": "Tab",
       "sort": "3",
       "chnName": "选项卡",
@@ -131,20 +101,20 @@
     },
     {
       "version": "1.0.0",
-      "name": "Price",
-      "sort": "0",
-      "chnName": "商品价格",
-      "desc": "商品价格组件，支持小数点前后应用不同样式、千位分隔、人民币符号等功能",
+      "name": "DatePicker",
+      "sort": "1",
+      "chnName": "日期选择",
+      "desc": "日期选择",
       "type": "component",
       "showDemo": true,
-      "author": "liaoyanli5"
+      "author": "iris"
     },
     {
       "version": "1.0.0",
-      "name": "DatePicker",
+      "name": "Calendar",
       "sort": "1",
-      "chnName": "日期选择",
-      "desc": "日期选择",
+      "chnName": "日历",
+      "desc": "日历",
       "type": "component",
       "showDemo": true,
       "author": "iris"
@@ -201,13 +171,13 @@
     },
     {
       "version": "1.0.0",
-      "name": "CheckBoxGroup",
-      "sort": "1",
-      "chnName": "复选按钮组",
-      "desc": "成组出现的复选按钮组件",
+      "name": "Price",
+      "sort": "0",
+      "chnName": "商品价格",
+      "desc": "商品价格组件，支持小数点前后应用不同样式、千位分隔、人民币符号等功能",
       "type": "component",
       "showDemo": true,
-      "author": "Vicky.Ye"
+      "author": "liaoyanli5"
     },
     {
       "version": "1.0.0",
@@ -271,16 +241,6 @@
     },
     {
       "version": "1.0.0",
-      "name": "Calendar",
-      "sort": "1",
-      "chnName": "日历",
-      "desc": "日历",
-      "type": "component",
-      "showDemo": true,
-      "author": "iris"
-    },
-    {
-      "version": "1.0.0",
       "name": "Rating",
       "sort": "1",
       "chnName": "评分",
@@ -301,16 +261,6 @@
     },
     {
       "version": "1.0.0",
-      "name": "ImagePicker",
-      "sort": "1",
-      "chnName": "图片选择器",
-      "desc": "图片选择器",
-      "type": "component",
-      "showDemo": true,
-      "author": "苏子刚"
-    },
-    {
-      "version": "1.0.0",
       "name": "Menu",
       "sort": "3",
       "chnName": "菜单",
@@ -350,6 +300,56 @@
       "author": "lemon"
     },
     {
+      "version": "1.0.0",
+      "name": "ImagePicker",
+      "sort": "1",
+      "chnName": "图片选择器",
+      "desc": "图片选择器",
+      "type": "component",
+      "showDemo": true,
+      "author": "苏子刚"
+    },
+    {
+      "name": "Switch",
+      "version": "1.0.0",
+      "sort": "1",
+      "chnName": "开关",
+      "type": "component",
+      "showDemo": true,
+      "desc": "一种滑动开关，通过点击使按钮左右滑动，同时触发对应的开关状态",
+      "author": "Frans"
+    },
+    {
+      "name": "Radio",
+      "version": "1.0.0",
+      "sort": "1",
+      "chnName": "单选按钮",
+      "type": "component",
+      "showDemo": true,
+      "desc": "单选按钮，可组合成单选按钮组",
+      "author": "Frans"
+    },
+    {
+      "version": "1.0.0",
+      "name": "CheckBox",
+      "sort": "1",
+      "chnName": "复选按钮",
+      "desc": "复选多个选项",
+      "type": "component",
+      "showDemo": true,
+      "author": "Vicky.Ye"
+    },
+    {
+      "version": "1.0.0",
+      "name": "CheckBoxGroup",
+      "sort": "1",
+      "chnName": "复选按钮组",
+      "desc": "成组出现的复选按钮组件",
+      "type": "component",
+      "showDemo": true,
+      "author": "Vicky.Ye"
+    },
+    {
       "version":"1.0.0",
       "name":"ShortPassword",
       "chnName":"短密码",

src/nutui.js

@@ -1,4 +1,5 @@
-import { version, packages } from './config.json';
+import { version } from '../package.json';
+import { packages } from './config.json';
 import { locale } from './locales';
 
 const components = {};
@@ -69,7 +70,7 @@ if (typeof window !== 'undefined' && window.Vue) {
 // }, components, filters, directives, methods);
 
 const API = {
-    version: version,
+    version,
     locale,
     install,
     ...components,

src/packages/cell/__test__/cell.spec.js

@@ -9,7 +9,7 @@ describe('Cell.vue', () => {
     });
     
     it('文案展示', () => {
-        wrapper.setData({ title: '测试title', subTitle: '测试subTitle', desc: '测试desc', showIcon:true });
+        wrapper.setProps({ title: '测试title', subTitle: '测试subTitle', desc: '测试desc', showIcon:true });
 
         return Vue.nextTick().then(function () {
             expect(wrapper.find('.nut-cell-title').text()).toBe('测试title');
@@ -21,7 +21,7 @@ describe('Cell.vue', () => {
     });
 
     it('链接', () => {
-        wrapper.setData({ title: '测试title', subTitle: '测试subTitle', desc: '测试desc', showIcon: true, isLink: true, linkUrl:'http://m.jd.com' });
+        wrapper.setProps({ title: '测试title', subTitle: '测试subTitle', desc: '测试desc', showIcon: true, isLink: true, linkUrl:'http://m.jd.com' });
 
         return Vue.nextTick().then(function () {
             expect(wrapper.classes('nut-cell-link')).toBe(true);

src/packages/imagepicker/__test__/imagepicker.spec.js

@@ -8,7 +8,7 @@ describe('ImagePicker.vue',() => {
     });
 
     it('点击删除图片',() => {
-        wrapper.setData({
+        wrapper.setProps({
             imgList:[{
                 id:1,
                 src:"//img1.360buyimg.com/da/jfs/t1/4436/26/9691/78074/5bad0668E7ce89ec6/c234b749ae9e7332.jpg"

src/packages/skeleton/doc.md

@@ -3,47 +3,67 @@
 ## 长方形
 
 ```html
-    <skeleton-square width="200px"  ></skeleton-square>
-
+<skeleton-square 
+    width="200px"
+>
+</skeleton-square>
 ```
 
 ## 圆形
 
 ```html
-    <skeleton-circle  diameter="50px"></skeleton-circle>
-
+<skeleton-circle 
+    diameter="50px"
+>
+</skeleton-circle>
 ```
 
 ## 横向排列
 
 ```html
-<row padding="15px 10px 0 ">
-
-    <skeleton-square width="200px"  ></skeleton-square>
-    <skeleton-square width="50px" margin="0 0 0 40px"></skeleton-square>
-    <skeleton-square width="50px"  margin="0 0 0 10px"></skeleton-square>
+<row 
+    padding="15px 10px 0"
+>
+    <skeleton-square 
+        width="200px"
+    ></skeleton-square>
+    <skeleton-square 
+        width="50px" 
+        margin="0 0 0 40px"
+    ></skeleton-square>
+    <skeleton-square 
+        width="50px" 
+        margin="0 0 0 10px"
+    ></skeleton-square>
 </row>
-
 ```
 
 ## 纵向排列
 
 ```html
- <column>
-        <skeleton-square width="275px" :count="2" margin="5px 10px 5px 10px"></skeleton-square>
-        <skeleton-square width="100px"    margin="5px 10px 5px 10px"></skeleton-square>
+<column>
+    <skeleton-square 
+        width="275px" 
+        :count="2" 
+        margin="5px 10px 5px 10px"
+    ></skeleton-square>
+    <skeleton-square 
+        width="100px" 
+        margin="5px 10px 5px 10px"
+    ></skeleton-square>
 </column>
 ```
 
-##  layout（row|column） Props
+## Props
+
+layout（row|column）
 
 | 字段 | 说明 | 类型 | 默认值
 |----- | ----- | ----- | -----
 | width | 宽度 | String | -
 | padding | 填充间距 | String | -
 
-
-## basic（square|circle）Props
+basic（square|circle）
 
 | 字段 | 说明 | 类型 | 默认值
 |----- | ----- | ----- | -----