使用vue-cli创建Vue项目
前言：昨天晚上刚创建好一个Vue项目，踩了不少坑。作为一个后端工程师，还是值得肯定的(*￣︶￣)。写一篇文章纪念分享一下！
- 安装webpack
打开dos命令窗口，执行命令npm install -g webpack
安装完成后，再次执行命令webpack -v
出现版本号即为安装成功！ - 安装vue-cli
打开dos命令窗口，执行命令npm install vue-cli -g
安装完成后，再次执行命令vue -V #注意：此处为大写V
出现版本号即为安装成功！ - 说明
3.1 提示需要安装webpack-cli
作者在用webpack -v查看版本的时候，命令询问我是否需要安装webpack-cli工具，当时选择了NO，后面发现在创建vue项目时，出现了error。询问某前端工程师，他告诉我没关系，不影响使用，但是作为后端工程师对eroor的态度是零容忍的。于是我选择了YES，但是发现webpack-cli居然没有安装到我配置的指定路径！！！只好在指定路径下面执行安装语句，这才安装到了我想要的路径下面！后面创建项目便没报错了。
NodeJS安装及环境配置
3.2 执行vue -V和webpack -v时，一直提示‘不是内部或外部命令’
遇到这种问题，暂时不用太慌张。作者开始也遇到这种情况，一直没解决，后面发现创建vue项目的语句执行是没问题的，而且项目创建好后，再次执行vue -V和webpack -v便不报错了。作者现在也没想通o(╥﹏╥)o。当然前提是在安装webpack和vue-cli时没有报错！！！ - 创建vue项目
cd 找到项目文件
然后执行vue init webpack 项目名字<项目名字不能用中文>
接下来就是询问过程
Project name (my-project) # 项目名称（我的项目） Project description (A Vue.js project) # 项目描述一个Vue.js 项目 Author 作者（你的名字） Install vue-router? (Y/n) # 是否安装Vue路由，也就是以后是spa（但页面应用需要的模块） Use ESLint to lint your code? (Y/n) # 使用 ESLint 到你的代码？ （Y [ yes ] / N [ no ]） Pick an ESLint preset (Use arrow keys) # 选择一个预置ESLint（使用箭头键） Setup unit tests with Karma + Mocha? (Y/n) # 设置单元测Karma + Mocha？ （Y/ N） Setup e2e tests with Nightwatch? (Y/n) # 设置端到端测试，Nightwatch？ （Y/ N）
cd 项目名字
然后执行npm install vue-router vue-resource -save
安装 vue 路由模块vue-router和网络请求模块vue-resource –save-dev 是你开发时候依赖的东西，–save 是你发布之后还依赖的东西 ：npm install vue-router vue-resource –save
最后执行npm run dev
这个时候说明你可以访问vue项目了
以上就是本篇文章的全部内容！