Vue 安装及运行

环境介绍：
Win10+WebStorm

一，Vue.js简介

    Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。
    本文的主要内容是如何在windows10环境下正确安装Vue.js并运行项目。

二，安装的node.js

访问node.js官网https://nodejs.org/en/，下载最新版本node，根据提示安装。
安装成功之后，通过运行打开命令行程序的cmd.exe，输入命令

node -v

安装成功之后，通过运行打开命令行程序的cmd.exe，输入命令若安装成功，则会显示对应版本号。

在下载的node.js的的同时，计算机会安装npm包管理器，输入命令

npm -v

若安装成功，会显示出npm的版本信息

三，安装cnpm

由于使用npm安装插件是从国外服务器上获取的，国内使用会出现下载速度较慢，下载失败等问题，因此我们可以使用npm的国内镜像–cnpm。
在cmd.exe中输入命令

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

等待安装完成，我们就可以使用cnpm代替npm管理安装包了。
关于cnpm，若想了解更多，请访问淘宝团队官方网址http://npm.taobao.org

四，安装Vue-cli

在cmd.exe中输入命令

npm install -g vue-cli

等待完成

五，构建项目

在CMD.EXE中将目录移动至选定目录，即项目创建的位置。
在选定目录下输入命令

vue init webpack Vuename为项目名称

在选定目录下输入命令之后按照提示输入项目名称，描述，作者等信息。
创建的项目文件夹如图所示:

六，运行项目
打开WebStorm(软件需下载安装) /file/open 再选择项目 new window 现在只是打开了项目而已，要运行得配置一下如图：（在webStorm 软件视图右上角有一个 Edit Configurations ）


如图配置就好了，打开控制台：

将位置移动至项目目录，输入命令
npm run dev

等待加载完成，打开浏览器，输入localhost：8080，若运行成功，则会显示以下页面