vue 脚手架页面文件列表读取

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

已注册用户请登录

这是一个创建于 175 天前的主题，其中的信息可能已经有所发展或是发生改变。

在 vue 搭建的脚手架中，通过 vue-router 标记哪些文件为页面文件，例如：

const router = new Router({
  routes
})

const routes = [
	...
]

现在想拿到脚手架中哪些文件为路由文件和它的路由信息，包括路由 path 和对应的组件地址。目前已知方式：

ast 解析，较为麻烦，需要考虑父路由 path 拼接请问有更好的方式吗

脚手架

文件

const

Vue

8 条回复 • 2023-11-06 02:54:33 +08:00

xiaoriri666

175 天前

一般是这么处理的，新建个文件夹，然后所有的静态路由都放在这个文件夹下，然后用 import.meta.glob 导入，参考如下代码
```js
const models = import.meta.glob('./*.js', {eager: true})

function formatModules(_modules, result) {
Object.keys(_modules).forEach((key) => {
const defaultModule = _modules[key].default;
if (!defaultModule) return;
const moduleList = Array.isArray(defaultModule)
? [...defaultModule]
: [defaultModule];
result.push(...moduleList);
});
return result;
}
const staticRouter = formatModules(models, [])

export default staticRouter
```