我在Vue组件脚本部分定义了一个接口，当我试图将其导入另一个类型脚本文件时，出现了以下错误：
TS2614: Module '"../pages/categories/alimentation/index.vue"' has no exported member 'BenefitDetails'. Did you mean to use 'import BenefitDetails from "../pages/categories/alimentation/index.vue"' instead

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'

export interface BenefitDetails {
  name: string
  frequency: string
  cost: number
  icon: string
  description: string
}

@Component
export default class MyComponent extends Vue {
  // my props ...

  mounted() {}
}
</script>

// Error in import below
import { BenefitDetails } from '~/pages/categories/alimentation/index.vue'

export function getBenefitFrequencyColor({ frequency }: BenefitDetails) {
  switch (frequency) {
    case 'Mensal':
      return 'blue'
    default:
      return 'yellow'
  }
}

我在this问题中找到了VSCode的解决方案，但我使用的是WebStorm。
UPDATE：我不想将接口声明移动到另一个文件