Vue入门（2）-- vuecli 安装与创建项目（相关问题解决）

1. vuecli介绍

官网链接：https://cli.vuejs.org/zh/guide/

2.vueCLI 安装

（前提： Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。可查看官方说明）

使用如下命令安装新版本

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

安装完成之后输入命令vue -V（注意是大写V）或vue --version，即可查看vuecli版本，此处已经安装4.2.3版本

--------------------------------------------------------------------------------------------------------------------------------------------------------------------

附加，4.2.3版本按照成功勿看

由于新版本的更新修改了命令，我开始安装输入npm install -g vue-cli安装了2.9.6版本

若想要修改nodejs2.x 为高级版本需要先卸载原始版本再重新安装即可，命令为：

npm uninstall -g vue-cli

 

----------------------------------------------------------------------------------------------------------------------------------------------------------------------

3.创建第一个Vue项目

（我在创建的过程中出现了一些问题，也一并收录进来）

1.使用命令行原始创建vue项目，在命令行输入如下代码：

vue create hello(hello为我创建的项目名称)

2.选择相应的选项后下一步（按照自己的需求选择）：

3. 开始创建项目

如果正常创建，则会出现如下提示，表示创建成功：

--------------------------------------------------------------------------------------------------------------------------------------------------------------------

但是开始我报错了：以下是错误分析，如果创建成功可以跳过

（1）解决方法 参考链接：https://blog.csdn.net/qq_35457469/article/details/102924524（有两种方法，我尝试了第二种直接用命令清理，在命令行输入：）

npm cache clean --force

之后再进行创建，如果成功即可。

（2）然而我这里问题并没有解决，反而出现了新的错误：

我进行了如下尝试：

1.npm install chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver  没有用

2.以为是版本问题，因此更新了npm的版本，输入npm install -g npm@latest  没有用

3.npm cache clean --force 清除npm的缓存

此时终于有效果了，重新创建first项目，创建成功

参考链接：https://blog.csdn.net/genius_yym/article/details/84645915

------------------------------------------------------------------------------------------------------------------------------------------------------------------------

4.按照提示输入命令运行项目

cd first 
npm run serve

看见提示表示运行成功，并且可以在浏览器输入http://localhost:8080/ 看到如下界面，表示已经成功创建一个vue项目