VueCLI路由目录文件

177 阅读1分钟

image.png

大致作用:

node_modules:Vue-cli包

public:(html文件根目录)

src:(源码,操作文件目录) assets:(公共资源:小图标。在public的index文件中使用) components:(组件,存放工具,存放组件等) router:(路由配置) store:(存储,状态管理,用于管理vuex) views:视图(界面页面)

APP.vue(全局导航,入口,导航路径,公共配置,操作界面) main.js(调用,全局配置,网站资源) registerservicework.js(pwa技术,关于服务配置)

配置流程(案例):

views>test.vue

image.png

router>index.js

导入路由(链接vue文件):

import Test from '@/views/test/test.vue'

配置路由

{
    path:'路由地址' "/test",
    compponent:Test
}

Views>App.vue

<router-link to="/test">测试</router-link>