PHPStorm не может правильно найти файл, если указать lang=ts
Пишу приложеньку на Vue3+TS+Vite в PHPStorm. Сегодня возникла такая проблемка: PHPStorm не может зарезолвить созданные в Vite алиасы, если в атрибутах <scrypt>
у компонента Vue указать lang="ts"
.
Само приложение собирается нормально, тут проблем нет. Просто напрягает, само наличие "ошибки". Ну и немного то что я не могу перемещаться быстро по файлам просто кликая по методам и свойствам.
При этом, если убрать lang="ts"
, то алиас резолвится, НО в таком случае PHPStorm начинает подсвечивать TS конструкции как ошибочные.
Вот код для примера:
<script lang="ts">
import { computed, Ref, ref } from "vue"
import { useRoute } from "vue-router"
// Если есть атрибут lang="ts", следующие 2 строки считаются ошибочними
// и PHPStorm говорит "Module is not listed in package.json dependencies"
import GroupRepository from "@data/repositories/GroupRepository"
import PivotsRepository from "@data/repositories/PivotsRepository"
export default {
name: "CampaignDetail",
components: {
RssIcon,
},
setup() {
// Соответственно, если атрибут lang="ts" не установлен,
// следующая и через одну строки подсвечиваются как ошибочные
const groupId = computed<string>(() => useRoute()?.params?.id as string)
const RGroup = useStore().$repo(GroupRepository)
const group = computed(() => RGroup.find(groupId.value) as Group)
const eventStatCards = computed(() => RPivot.getGroup())
return {
group,
eventStatCards,
}
},
}
</script>
В конфике Vite
алиасы настроенны так:
export default defineConfig({
//...
resolve: {
extensions: [".mjs", ".js", ".ts", ".jsx", ".tsx", ".json", ".vue"],
alias: {
"@data": path.resolve(__dirname, "./src/data"),
"@layouts": path.resolve(__dirname, "./src/layouts"),
},
},
//...
})
Как бы сделать так чтобы все работало? Может я где-то галку упустил?
Источник: Stack Overflow на русском