搭建vue开发环境的步骤,六步完成
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了搭建vue开发环境的步骤,六步完成相关的知识,希望对你有一定的参考价值。
搭建vue开发环境的步骤,其实也挺简单的,之前这环境的配置也困扰着我
一:在搭建vue的开发环境之前,一定一定要先下载node.js,vue的运行是要依赖于node的npm的管理工具来实现,下载地址:http://nodejs.cn;注意是32还是64位;
二:下载好node之后,打开docs管理工具,先看看node安装成功了没有,输入 node -v ,回车,会输出node的版本号。
三:淘宝镜像安装成功之后,我们就可以全局vue-cli脚手架,输入命令:npm install --global vue-cli 回车;验证是否安装成功,在命令输入vue,出来vue的信息,及说明安装成功;
四、搭建完手脚架之后,我们要开始建一个新项目,这个时候我建议,精良不要装在C盘,因为vue下载下来的文件比较大,如果要改盘的话,直接输入D:(或其他盘符)回车就可以直接改盘,
五、然后我们开始创建新的项目输入命令:vue init webpack my-project 回车,my-project是我自己的文件夹的名字,是基于webpack的项目,输入之后就一直回车,直到出现是否要安装vue-route,
会一直出现如下:
1、Target directory exists. Continue? (Y/n) 直接回车默认(然后会下载 vue2.0模板,这里可能需要连代理)
2、Project name (vue-test) 直接回车默认
3、Project description (A Vue.js project) 直接回车默认
4、Author 直接回车默认 (作者)
5、Use ESLint to lint your code? n
6、pick an eslint preset. 默认Standard
7、setup unit tests with karma + mocha?No(单元测试不需要)
8、setup e2e tests with Nightwatch?No(单元测试不需要)
六、进入项目 cd my-project (cd 项目名字)
七、安装项目依赖
npm install
八、安装 vue 路由模块vue-router和网络请求模块vue-resource –save-dev 是你开发时候依赖的东西,–save 是你发布之后还依赖的东西
npm install vue-router vue-resource –save
六、启动项目
npm run dev
七、发布项目
npm run build
以上是关于搭建vue开发环境的步骤,六步完成的主要内容,如果未能解决你的问题,请参考以下文章