webpack
1.webpack在package里设置，可以执行npm run *;
dev:服务器的开启
start:服务器开启
build：项目打包
unit: 单元测试

 "scripts": {"dev": "node build/dev-server.js","start": "node build/dev-server.js","build": "node build/build.js","unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run","test": "npm run unit","lint": "eslint --ext .js,.vue src test/unit/specs","generate-icons": "vsvg -s ./svg-icons -t ./src/compiled-icons"},复制代码

vue：

1.JS文件与CSS的引入一般使用：

import {} from *.js
@import '*.css'复制代码

2.在各个组件设置绑定数据与方法：
template里的逻辑判断
v-if : 如果里面的内容逻辑成立 div显示

<div v-if="data的数据==你想判断的数据"></div>复制代码

v-bind ：如何里面内容的boolean为true则添加
v-model: 进行数据的双向绑定，input发生变化 data里的对应数据也发生变化
v-on : 事件处理v-on:keyup.enter="fuc()"//绑定一个回车键的keyup事件v-on：click.stop="fuc()"//阻止click的默认事件(更多在官方文档)复制代码

<input class="max-width" v-bind:class="{'form-group--error': $v.goodsNameZH.$error}//若成立class会被添加" v-model="goodsNameZH"//与data里的此数据进行双向绑定 type="text" id="doc-ipt-pwd-3"
:placeholder="$t('message.Goods.productNameCH')"//添加一个placeholder   @input="$v.goodsNameZH.$touch()"//v-on:与@一致,绑定输入框输入事件
>复制代码

v-for 与v-if的使用
1.如果v-if为true，div显示
2.循环attachList对象 并用item取出各个循环出来的数据并开始渲染出多个img
3.img中也有判断，如果item里有serverUrl，则显示，并且绑定一个src属性将item里的serverUrl显示到上面

    <div v-if="attachList.length>0" v-for="item in attachList"><img v-if="item.serverUrl" :src="item.serverUrl+'/'+item.serverName" width="100px" height="100px"><img v-else :src="'http://bdtimage.saohuijia.com/'+item.serverName" width="100px" height="100px"></div>复制代码

template绑定data与methods
（数据绑定没有this）
v-html : 为innnerHtml;

  <button type="button"class="am-btn am-btn-primary btn-loading-example cancel-save-button"@click="submit"//绑定的methods里的函数data-am-loading="{spinner: 'circle-o-notch', loadingText: '加载中'}"><span v-html="$t('message.submit')"></span>//在botton里显示的内容复制代码

export default{name:'命名的组件名'，data:function(){return{绑定的变量数据名：‘’，...}}created:function(){//在此处进行数据的获取与渲染页面this.绑定的变量数据名  =  '具体数据' || this.$route.params.变量数据名（由router-link传来的数据）}methods:{//方法的定义，箭头函数会改变This指向，如果在函数里this没有被定义的话，需要变为以下函数fuc : function(){},}复制代码

vue-router
1.新建一个router文件夹里的 *.js

import Vue from 'vue'                       //引入vue
import Router from 'vue-router'             //引入vue-router
import Login from '@/components/Login'      //引入需要加载的组件
import AdminPage from '@/components/AdminPage'Vue.use(Router)                             //使用 Routerexport default new Router({                 //NEW一个新的路由routes : [                             //路线配置{path:'/',                           //路径为根路径name:'index',                      //路由名称component :Login,                  //渲染的组件}，{path:'/admin'name:'admin',component : adminPage,children:[                      //admin路径下的子路由{ path: 'addGoods/:shopId',  //此处路径可传入数据以防页面刷新数据消失name: 'addgoods',component: AddGoods},]}]
})复制代码

router-link
：to 绑定一个 router-link要 进入的路由名字
= {} 可以传入一系列数据到下一个路由，然后在路由文件path里进行保存，

<router-link :to="{name: 'dish', params:{shopId: shopId, shopName: shopName, status: status}}"><button type="button" class="am-btn am-btn-default cancel-save-button"><span v-html="$t('message.cancel')"></span></button>
</router-link>复制代码

amazeui

<template><router-view></router-view>   // 此处是router-view 的渲染处
</template><script>
import amazeui from "amazeui"  //在此处引入amazeui
export default {               name: 'App'
}
</script>// 在此处引入需要全局加载的css
<style>@import "../node_modules/bootstrap/dist/css/bootstrap.min.css";@import "../node_modules/amazeui/dist/css/amazeui.css";
@import "../static/css/common.css";
@import "../node_modules/webuploader/dist/webuploader.css";
</style>复制代码