初始化Vue项目

• vue 把一个组件放在一个 .vue 文件中，在这个文件中有三个自定义标签：template、script、style，但是浏览器不能直接识别该组件，因此需要通过 webpack 进行打包编译，官方提供 vue-loader 对 .vue 文件进行处理。
• vue-cli 是 vue.js 的脚手架工具，使用之前需要安装 node 和 npm 包管理工具。
• vue实际开发使用 .vue 的单文件系统来实现，但是还需要哦诶只很多东西，因此有了 vue-cli 来构建一个项目开发必须使用的一些内容，我们称这个工具为：脚手架。
  通过 npm install vue-cli -g 安装好之后，我们可以在命令行使用一个命令：vue
• vue init
  init：初始化（创建）基于vue的项目
  vue init webpack hello：基于webpack来构建一个名称为hello的vue项目（项目构建一定要联网！联网！联网！）
  vue-cli 是一个交互式命令行，通过 vue 命令构建项目会需要我们填写一些项目的信息：
  Project Name：要创建的项目名称（该命令会生产一个 package.json 文件，文件中的 name 选项就是这个 ProjectName，默认为当前创建的项目目录名称，也可以自行制定（但是需要符合 package.json 中 name 命名规则，不要出现大写字母，空格，下划线，可以使用 - ）
  Project Description：项目简介，也会出现在 package.json 文件中,可选
  Author：作者，可选
  下一步直接回车
  Install vue-router：是否安装 vue 路由组件，做项目的话一定要安装
  Use ESLint to lint your code：是否需要使用 ESLint 模块进行代码检测
  Setup unit tests with Karma + Mocha?：是否安装测试（单元测试）
  Setup e2e tests with Nightwatch?：是否安装端到端的测试
• 项目需要安装的依赖包在 vue-cli 工具中自动生成的 package.json 文件中有说明
  dependencies：项目中实际需要使用到的依赖包
  devDependencies：项目开发过程中需要使用的一些工具包，不是项目实际线上代码的一部分
• 运行
  所需要的安装依赖包安装完成以后，就可以启动项目，
  npm run dev：开启一个测试开发环境
• 项目结构
  1. build目录：构建项目命令所需要使用到的一些脚本文件和配置文件
  2. config目录：在vue-cli中会自动安装一个小型的express搭建的热重载web服务器，config里面就是关于这个服务器的相关配置
  3. dist目录：项目编译构建上线后的存放目录
  4. node_modules目录：项目依赖包存放目录
  5. src目录：项目源代码存放目录
  6. static目录：静态资源存放目录
  7. main.js：vue脚手架为我们自动生成的项目中设置的入口文件，在该入口文件中，做了一些项目初始化的工作
     • 引入 Vue
     • 引入必要的组件
     • 创建Vue实例
       在项目开发过程中，我们的大部分任务是在src这个目录下完成的