vue-cli教程

Posted 2021-01-25

一、文件目录说明
main.js：应用的入口文件
App.vue：根组件，整个组件的入口

加载文件不要后缀名：
resolve:{
    extensions:[‘.js‘,‘.vue‘,‘.json‘],
    alias:{
        ‘vue$‘:‘vue/dist/vue.esm.js‘,
        ‘@‘:resolve(‘src‘)  //@就代表了"src"这个目录
    }
}
import App from ‘./App‘;  就相当于 ‘./App.vue‘;
import router from ‘./router‘  //加载某个目录下的index.js文件，可以简写，就相当于 ‘./router/index.js‘

.gitignore
上传git仓库的时候，不上传某些文件，比如node_modules，因为太大了，
所以从git仓库clone文件下来的时候，首先就是要npm install，安装package.json里面定义的依赖包

二、使用步骤

    安装模块
        npm install vue-router --save -dev (vue-cli脚手架里面就已经安装好了)
    引入模块
        import *VueRouter* from ‘vue-router‘
    作为vue的插件
        Vue.use(*VueRouter*)
    创建路由实例对象
        new VueRouter({
            ...配置参数
        })
    注入Vue选项参数
        new Vue({
            router
        })
    告诉路由渲染位置
        <router-view></router-view>