Vue入门笔记（三）——Vue-cli的使用

Vue的官网目前已将将Vue-cli单独的提取出来，现在进入Vue-cli的官网：Vue-cli

这里有个通知，需要注意一下：

Vue CLI 的包名称由 vue-cli 改成了 @vue/cli
如果你已经全局安装了旧版本的 vue-cli (1.x 或> 2.x)
你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它

安装Vue脚手架
Vue2.x

npm install -g vue-cli
yarn global add vue-cli

Vue3.x

npm install -g @vue/cli
yarn global add @vue/cli

利用Vue脚手架自动生成项目
Vue2.x

vue init webpack 项目名称

Vue3.x

vue create 项目名称

以Vue2.x为例，之后面选项如图：
Vue3.x选项基本大同小异，选择会有部分不同

注意：这里有两个坑。

Use ESLint to lint you code? 选择 No 否则你会被代码里面的ES6语法检查，中间的空格报错，报到你怀疑人生
可能第一次install，可能会出现chromedirver下载报错。执行以下命令即可

npm install chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver

安装好之后，屏幕会显示命令输入

进入目录：cd hello-world
运行：npm run dev

Vue3.x有一个UI界面，可以通过界面进行Vue项目的安装和管理