如何配置一个易于扩展的Vue路由？

本文共计2103个文字，预计阅读时间需要9分钟。

前言：从历史经验来看，开发一个新项目，从最初的项目部署到正式交付，以及交付后的持续维护，功能增强等过程，都需要对项目的一些既有结构和逻辑进行调整和优化。因此，此至关重要。

前言

从历往经验来看，开发一个新项目，往往在刚开始部署项目，到项目的正式交付，以及交付后的后续维护，功能增强等过程，都需要对项目的一些已有结构和逻辑进行调整。

因此，如果有些内容刚建项目时不考虑好未来的可扩展性，后续调整会很麻烦。

这里先来说，在vue项目中，如何写路由配置，更利于未来可扩展。

vue-router的基本配置

为了方便新学者的阅读与理解。先来看一下最基本的路由是如何配置的

// 0. 导入Vue和VueRouter脚本，如果使用模块化机制编程，要调用 Vue.use(VueRouter) // 1. 定义 (路由) 组件。 // 可以从其他文件 import 进来 const Foo = { template: '<div>foo</div>' } const Bar = { template: '<div>bar</div>' } // 2. 定义路由 // 每个路由应该映射一个组件。