写在开头
Vue作为前端项目,本身不依赖IDE,完全可以使用任何文本编辑器进行开发。我使用vscode仅是因为比较习惯,vscode几乎可以作为任何项目的开发IDE。
环境安装
- 安装nodejs,去官网下载安装包,无脑安装即可。
安装好后使用node -v验证安装成功:
nodejs自带会安装npm,也可以使用npm -v验证一下:
- 为了下载更快,可以安装nodejs淘宝镜像加速器(cnpm),装完验证一下:
npm install cnpm -g
cnpm -v
- 安装vue脚手架创建程序vue-cli:
cnpm install vue-cli -g - 安装打包工具webpack、webpack-cli、webpack-dev-server
cnpm install webpack -g
cnpm install webpack-cli -g
cnpm install webpack-dev-server -g - vscode安装Vetur插件,主要支持Vue的语法检查、高亮、智能提示等IDE能力:
初始化运行Vue脚手架
- 初始化Vue项目,按照提示一步一步确认Yes/No就可以了
vue init webpack ostrich
- 依赖安装完以后,直接就可以进入项目文件夹运行
npm run dev
执行后会进行编译打包,完成后如下:
- 这时候就可以在浏览器中输入http://localhost:8080访问该项目了