使用Vue建立一个新项目

一、环境

保证已经安装好了node\npm\vue等工具，将路径设置为想要创建新项目的文件夹路径

二、关于npm与cnpm
 npm包管理器，是集成在node中的，node环境安装完成，npm包管理器也有了。因为有些npm有些资源被屏蔽或者是国外资源的缘由，常常会致使后面用npm安装依赖包的时候失败，全部我还须要npm的国内镜像---cnpm。

安装cnpm：

在命令行中输入

npm install -g cnpm --registry=http://registry.npm.taobao.org

而后等待，完成以后，咱们就能够用cnpm代替npm来安装依赖包了

三、安装vue-cli脚手架构建工具

 

在命令行中运行命令

 

cnpm install -g vue-cli 

 

而后等待安装完成。(注意，这里使用cnpm来替代npm，否则速度超级慢，会致使卡在那)

 

经过以上三步，咱们须要准备的环境和工具都准备好了，接下来就开始使用vue-cli来构建项目

四、构建结构框架
脚手架装完后，在命令行中运行命令

vue init webpack firstVue

这个命令的意思是初始化一个项目，其中webpack是构建工具，也就是整个项目是基于webpack的。其中firstlsqVue是整个项目文件夹的名称，自定义，这个文件夹会自动生成在你指定的目录中.

运行初始化命令的时候回让用户输入几个基本的选项，如项目名称，描述，做者等信息，若是不想填直接回车默认就好，随后，文件夹中就会出现不少基本的目录结构和代码。其中，咱们主要在src目录中作修改。到这里，这个项目如今还只是一个结构框架，整个项目须要的依赖资源（就是前面说到的npm安装依赖包）都尚未安装。

五、安装项目所需的npm依赖包（使用前面的cnpm）
要安装依赖包，首先cd到项目文件夹（firstlsqVue文件夹）

cd firstlsqVue

而后运行命令

cnpm install

安装完成后，原来的目录结构中会出现一个新的文件夹：node_modules,里面就是咱们项目须要的依赖包资源，安装完依赖包以后，就能够运行整个项目了

六、运行项目

在项目目录中，运行的命令如上面一种所示，

npm run dev

会用热加载的方式运行咱们的应用，热加载可让咱们在修改完代码后不用手动刷新浏览器就能实时看到修改后的效果。