vscode开发vue2
整理自Vue入门视频教程:https://www.bjsxt.com/down/11723.html
- 百度搜索vs code去官网下载安装vs code
- 在Vscode里安装Vetur插件,装下载次数最多的那个
- 百度搜索Node.js去官网下载并安装Node.js
- 安装Webpack
npm install webpack -g
如果Mac提示权限问题可以在命令行前面加上sudo
- 安装Vue CLI
npm install -g @vue/cli
- vs code打开一个文件夹,终端执行命令创建vue项目
vue create project-name
选择手动配置,回车,然后勾选Babel、PWA、Router、CSS,回车然后选择Less
win10可能会提示“vue : 无法加载文件 C:/Users/John/AppData/Roaming/npm/vue.ps1,因为在此系统上禁止运行脚本”,把这个报错拿去百度,一般第一条就是解法
- 进入project-name文件夹,运行项目:
npm run serve
- 添加组建方式:在src目录下新建components目录,然后在目录里新建组建文件Hello.vue。在App.vue里面添加
import Hello from './components/Hello.vue'
在export default里添加
components: {
Hello
}
这样就可以在div里引用它:
<hello />
- 更多组建的高级复用方式,可以去vue官网查看Prop和$emit
- 路由的使用:之前创建项目时选择了Router就可以直接用,路由的使用,包括二级路由,请看顶部视频教程
- 调试时跨域的处理:请看顶部视频
- Element-UI的使用,执行安装:
vue add element