vue 学习笔记之框架搭建（一）

@Candyvue学习笔记之框架搭建（一）

第一步

安装npm 和 Nodejs。使用npm -version 和node --version两个命令分别查看已经安装的版本。
安装vue脚手架 : npm install –g vue-cli
安装指定版本的脚手架：npm install -g vue-cli@3.0.0 3.0.0是版本号
已经安装过需要更新脚手架版本 ： npm install –g @vue/cli
安装完成后查看vue的版本： vue -V

第二步

环境准备好之后，即可搭建自己的第一个项目。有两种方式，命令行的方式和图形化界面的方式。

1. 命令行的方式：2.9及以前版本：vue init webpack test ，一直enter，默认选择，将在打开命令窗的目录生成一个test文件夹。这种方式生成项目依赖多，体量大。另一种命令：vue init webpack-simple test，这种方式生成的项目目录结构会简洁很多。3.0版本及以上：vue create test 。
2. 图形化界面的方式： vue ui 。浏览器会自动弹出一个页面，在该页面可以手动生成一个项目。

第三步

有时候我们是直接从SVN下载别人的代码，这时候不需要搭建自己的项目。但是需要添加依赖：
执行npm install命令即可。该命令是连接国外服务器上的库，下载速度令人堪忧。
可以使能cnpm 命令：执行命令npm install -g cnpm --registry=https://registry.npm.taobao.org
执行完成以后，下载依赖也可以使用cnpm install命令。

第四步

启动项目，2.9及以前版本：npm run dev 。3.0及以后版本 ： npm run serve 。
该命令也可以自己配置，在package.json文件中的scripts标签中查看。

启动之后，就可以在命令窗口的最下方看到查看页面的地址。本地默认是localhost:8080。
注意设置Google浏览器为默认浏览器，如果在IE中打开，可能样式显示不了。