1.window窗口
安装node(步骤省略,一路next即可)
安装成功以后执行命令:node -v
2.安装vue-cli
npm install -g vue-cli
3.安装webpack
Npm install -g webpack
npm install -g webpack-cli
4.创建项目
1.切换到工作目录下面
命令 Cd/d 目录
2.创建项目
如果使用的是vue3的命令去创建项目 那么就需要把之前的2版本的vue-cli卸载重新安装vue3
npm uninstall -g vue-cli 卸载2.9.6 vue-cli
npm install -g @vue/cli
3.步骤
命令 vue create 项目名称
下一步
选择最后一个
空格选中和取消这里我们选中1和4取消选中倒数第三个
回车下一步
这里我们选择2.x
回车下一步
输入y
选择第二个
回车
这里是选择保存模板,如果是多次使用建议选择y
回车
项目创建完成
运行成功
5.命令和标签
1.启动命令npm run serve
Npm run XXX
xx的 值是由package.json中scripts里面的参数决定的
2 .路由跳转
Router-link = a to=href
<router-link to=””>
3.<router-view/>
作用: 容器 存放组件的内容的
6.总结:
1.创建组件
2.声明一下路由
3.使用路由
<router-link to="/test">test</router-link>
-
4.访问
组件显示的时候 App.vue一定不能少的一个标签是:<router-view/>
5.组件的注意事项:
组件中<template></template>里面有且只能有一个根标签
7.使用ui
1.安装
Npm i element-ui -S
2.使用ui
在main.js中写入下面的内容
import router from './router'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';