最近刚刚用vue写了个公司项目，使用vue-cli构建的，算是中大型项目吧，然后这里想记录并且分享一下其中的知识点，希望对大家有帮助,后期会逐渐分享；话不多说，直接上代码！！
vue-store高仿小米商城
下载
本项目前后端分离，前端基于Vue+Vue-router+Vuex+Element-ui+Axios，参考小米商城实现。后端基于Node.js(Koa框架)+Mysql实现。前端包含了11个页面：首页、登录、注册、全部商品、商品详情页、关于我们、我的收藏、购物车、订单结算页面、我的订单以及错误处理页面。实现了商品的展示、商品分类查询、关键字搜索商品、商品详细信息展示、登录、注册、用户购物车、订单结算
main.js
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
import './assets/css/common.css'
Vue.config.productionTip = false
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
template: '',
components: { App }
})
router文件夹里面的index.js
import Vue from 'vue'
import Router from 'vue-router'
import home from '../components/home' //这里可以选择2种写法，一种是写在这里，一种是写在component里面，看下方代码~
Vue.use(Router)
export default new Router({
mode:'history',
routes: [
{
path: '/',
component: home
},
{
path:'/pagevue',
component:pagevue => require(['../components/childCom/pagevue.vue'], pagevue),
},
{
path:'/nextpagevue',
component:nextpagevue => require(['../components/childCom/nextpagevue.vue'], nextpagevue),
}
]
})
home.vue
我是首页点我进下一个路由
pagevue.vue
我是子页面点我继续进下一个路由
nextpagevue.vue
我是另外一个子页面点我回到首页
common.css
* {
margin: 0;
padding: 0; }
.homeMain {
text-align: center;
margin-top: 100px; }
.homeMain .routerName {
color: #1eb89c;
border: 1px solid #1eb89c;
margin-top: 20px; }
/*# sourceMappingURL=common.css.map */
