vue脚手架vue-cli的使用及理解

关于vue.js
vue.js是一套构建用户界面的 轻型的渐进式前端框架。它的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。使用vue可以给你的开发带来极致的编程体验。

关于vue-cli
Vue-cli是vue官方提供的一个命令行工具（vue-cli），可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置，带来现代化的前端开发流程。只需一分钟即可启动带热重载、保存时静态检查以及可用于生产环境的构建配置的项目。

使用：
安装vue-clinpm install -g vue-cli
使用vue-cli初始化项目vue init webpack my-project
进入到目录cd my-project
安装依赖npm install
也可以用vue ui来快速创建vue ui

学习与理解：

一、vue中使用jq库的插件

1. 找到需要使用的插件

2. 下载插件需要的css和js

3. 在vue文件所在的根目录下载jquery包，导入到vue文件中的script标签所在位置:
   a、import $ from ‘jquery’
   b、因为插件需要操作dom元素,需要在页面结构加载完毕后才执行js代码，因此要将js代码写在Vue生命周期的 mounted（）{ js代码 } 中

4. 将需要的css文件导入对应的vue文件的style中 :

     @import "css文件的相对路径",根据需求,做适当的样式调整等
   

二：
1，.vue文件是一个组件，写html代码、js代码、css代码

2， 一个项目有一个根组件，用来承接所有子组件的展示

3，每个子组件单独创建，然后通过路由注册，配置url地址建立访问，最后导出给入口文件。

4，入口文件导入路由文件后，将路由注入到根实例中，在跟组件中渲染

三：
不是所有的包或插件都要使用vue.use( )才能使用，而是基于vue的包和插件，才需要通过vue.use（）来集成使用

四：

• main.js是整个项目的入口文件,是项目的基石。所有的文件都要关联到这里,才能最终通过webpack打包展示。

• App.vue是根组件,是项目打开后显示的第一个页面。注入在根实例上的路由，路由关联的组件最后都会渲染在App.vue的router-view占位标签中。

• router文件夹中的index.js是一个路由文件,所有的子组件的注册都在这里执行:
  a、使用import导入组件
  b、创建路由couter，配置路由参数,自动注册组
  c、export default router 导出路由