(1)核心技术栈一览图
(2)Node环境安装
(3)Node环境升降级
该命令只支持mac linux系统,windows直接卸载重装
(4)Git安装和配置
(5)VsCode的Git地址
(6)存储密码-SSH添加密钥
(7)VueCli4.0安装
(8)vue-cli指定版本安装
安装新的版本前,需要先把之前安装的版本卸载掉。
vue卸载:npm uninstall vue-cli -g(3.0以下版本卸载)
npm uninstall -g @vue/cli(3.0以上版本卸载)
vue安装:npm install -g @vue/cli (安装的是最新版)
npm install [email protected] (指定版本安装【指定版本为3.0以下版本】,其中2.9.6为版本号)
npm install -g @vue/[email protected](指定版本安装【指定版本为3.0以上版本】,其中3.11.0为版本号)
vue版本查看:vue -V
(9)前端跨域解决方案
创建 一个vue.config.js文件
module.exports = {
devServer:{
host:'localhost',
port:8080,
proxy:{
'/api':{
target:'https://www.imooc.com',
changeOrigin:true,
pathRewrite:{
'/api':''
}
}
}
}
}
(10)插件安装
(11)router.js
注意带/的是绝对路径
不带/的是相对路径,拼接父路由
import Vue from 'vue'
import Router from 'vue-router'
import Home from './pages/home'
import Index from './pages/index'
import Product from './pages/product'
import Detail from './pages/detail'
import Cart from './pages/cart'
import Order from './pages/order'
import OrderConfirm from './pages/orderConfirm'
import OrderList from './pages/orderList'
import OrderPay from './pages/orderPay'
import AliPay from './pages/alipay'
Vue.use(Router);
export default new Router({
routes:[
{
path:'/',
name:'home',
component:Home,
redirect:'/index',
children:[
{
path: '/index',
name: 'index',
component: Index,
}, {
path: '/product/:id',
name: 'product',
component: Product,
}, {
path: '/detail/:id',
name: 'detail',
component: Detail,
}
]
},
{
path: '/cart',
name: 'cart',
component: Cart
},
{
path: '/order',
name: 'order',
component: Order,
children:[
{
path: 'list',
name: 'order-list',
component: OrderList,
},
{
path: 'confirm',
name: 'order-confirm',
component: OrderConfirm,
},
{
path: 'pay',
name: 'order-pay',
component: OrderPay,
},
{
path: 'alipay',
name: 'alipay',
component: AliPay,
}
]
}
]
});
(12)接口错误拦截
(2)Node环境安装
(2)Node环境安装
(2)Node环境安装
(2)Node环境安装
(2)Node环境安装
(2)Node环境安装
(2)Node环境安装
(2)Node环境安装