是否可以根据组件正在使用的视图动态更新导入路径？

如何解决是否可以根据组件正在使用的视图动态更新导入路径？

Soo 最近，我从使用 Vue 处理小型失业项目过渡到现在构建一个完整的设计系统，并且在我如何组织我的应用程序方面遇到了一些潜在的结构问题。我试图解决的问题基于三个组件（粗体文件夹）； “section-content >变体/指南”（即primary-button.vue、commit-button.vue等）、“sections>”（即guidelines-section.vue、intro-section.vue等）和“views>”（ button.vue、avatar.vue、form-elements.vue）。虽然部分内容 > 变体组件会根据每个视图而有所不同，但指南部分在导入变量名称方面更通用 - 避免通过添加视图名称（iebuttonsBestPractices、avatarBestPractices 等）来复制每个导入在每个指南上，有没有一种方法可以在导入路径的后面部分使用 prop，然后每个视图可以使用所需的（特定于视图的）文件路径返回它？

它目前的样子，强调部分内容（按钮）的特殊性。

import bestPractices from ‘@/components/section-content/buttons/guidelines/best-practices.vue’
import states from ‘@/components/section-content/buttons/guidelines/states.vue’
import spacing from ‘@/components/section-content/buttons/guidelines/spacing.vue’
import responsiveness from ‘@/components/section-content/buttons/guidelines/responsiveness.vue’

与我在下面想做的相比。

import bestPractices from ‘@/components/section-content/’ {{ viewFilePath }}’ ’

viewFilePath : {
  type: String
},

希望这是有道理的，并提前感谢您的帮助！