2021-12-13mac book air m1 Vue-cli

安装Node.js

官网地址

1.无脑安装完成后
2.终端 测试是否安装成功 node -v
npm -v

3…安装Node.js镜像加速器 yarn
sudo npm install -g yarn
4.安装vue -cli
sudo npm install vue-cli -g

webpack 将vue打包降级 供所有版本浏览器使用

1.新建一个初始化项目 vue init webpack 项目名
vue init webpack hello-vue
2.初始化配置 一路选择No 后边自己下载
3.初始化结束后 进入项目文件夹
cd hello-vue
4.安装 vue-router
sudo npm install vue-router --save-dev
5.安装自己需要的前端模板框架 比如element-UI BootStrap…
sudo npm install jquery --save
npm install bootstrap --save
npm install popper.js --save
npm install vue bootstrap-vue bootstrap
6.安装所有的依赖
npm install
7.安装sass加载器
cpnm install sass-loader node-sass --save-dev
8.启动测试
npm run dev

测试成功 Idea打开项目
界面中的所有元素必须写在标签里，不能直接在根结点下
1.删除原asserts、views下的文件

2.views下创建一个vue组件 template

3.router下创建路由配置 index.js

4.将路由配置到主组件页面中

npm run dev 运行
ctrl + c 停止运行
若报错 降低sass版本
然后npm install 重新加载

docsfiy

组件导出什么名 引用什么名

路由嵌套

children

参数传递以及重定向

前端传递

路由接收

界面取出展示

通过props传递参数

1.开启路由props传递

2.使用参数

重定向

路由 不带#

路由钩子

相当于过滤器


在钩子函数中使用异步请求
1.安装Axios npm install axios -s
引用

在响应前加载数据