vue-cli

1)通过命令行的方式下载依赖：bootstrap、css、js、jquery

2)能快速进行零配置原型开发。 
    而不是之前那样子:vuejs vuerouter 一个个下载好，还要放好位置。
    而用到axios时，就直接一条命令搞定。
    
3)相当于SpringBoot快速初始化，vue-cli就相当于后端的maven。

4)运行时依赖：@vue/cli-service
    基于webpack构建，带有合理默认配置。
    可通过插件方式扩展。
    
5)webpack是啥？
    就是一个前端的打包工具，类似于服务器的jar、war。
    
6)yarn: 也是打包方式，但是流行程度还不够高。

7)node.js写的前端服务器。 类似于后端的用java写的tomcat。

8)设置npm镜像
    // 设置淘宝镜像
    npm config set registry https://registry.npm.taobao.org/
    
    // 验证下
    $ npm config get registry

9)npm config ls

10)使用vue开发，之后我们开发的东西全部是一个个组件，然后拼装为一个完整的系统。
    之后打包，vue-cli会把.vue打包为运行时的html文件。
    
    
    跟java有点像，开发的是java,运行时是.class文件。

11)一切皆组件： 谨记！！！

12)vue.js脚手架不希望我们对根Vue做修改，因此被保护在main.js中。

13)默认：main.js找App.vue, App.vue中显示 router-view, 这个

14)export default {  // 暴露当前组件对象
        name: "App",
        data(){
        
            return {
                msg : "aaa"
            }
        }
        ,
        
        
        methods: {},
        
        components: {
        },
        
        created(){
        
        },
   }
   
15)如何从Home组件切到User组件？   
    那就是注册路由，根据不同的路由，显示不同的组件就行了。
    
16)重定向
     我们home本来路由是：/home, 但是我们希望访问/时也到home。那就需要在 / 路由做下重定向。
     
     
17)系统：
        App.vue:
            一堆链接。
            
            <router-view/>  // 展示路由组件
            
            
18)组件的复用
        组件是可以复用的，比如：我们希望一直展示一个footer。
        
        那么，我们在Home.vue中 
            import Footer xxx;  // 引入组件
            
            export default {
                name: "Home",
                components: {
                    Footer,   // 注册组件
                },
                
                data(){
                },
                
                methods: {
                
                }
            }
            
        在Home.vue的template处：
            <Footer> </Footer>  // 直接使用组件就行了。
    
    
19)使用data中的数据
    v-for 等语法。
    
20)组件的生命周期
        created // 可以在里面发送http请求，从而获取数据显示在网页中。
        
        
21)用户添加使用单独的组件实现
    1.子路由
    2.引入组件，并且显示在 router-view
    
22)切换路由
    this.$router.push("/user") 
    
23)监听路由
    watch: {
        handler : function(val, oldVal){
            
        },
    }