CODEWITHSUNDEEP
typescriptvuejs3vite
AntiLun
AntiLun

Reputation: 53

How to import type in vue3 setup script with typescript?

I want to use <script setup> feature with props type check in typescript. But it seems that <script setup> didn't import RouteRecordRaw as a type but as a value? And if I run this code in vite, the browser console will print an error:

"Uncaught SyntaxError: The requested module '/node_modules/.vite/vue-router.js?v=52a879a7' does not provide an export named 'RouteRecordRaw'"

Code:

<script lang="ts" setup>
import { RouteRecordRaw } from "vue-router";
// VSCode will print an error: "RouteRecordRaw" only refers to a type, butisbeing used as a value here. (TS2693) 

import { defineProps } from "vue";

const props = defineProps<{
  routeList: Array<RouteRecordRaw>;
}>();

const renderRoutes = props.routeList;
</script>

Upvotes: 5

Views: 8493

Answers (1)

Michal Lev&#253;
Michal Lev&#253;

Reputation: 37763

Use this:

import type { RouteRecordRaw } from "vue-router";

More info

Upvotes: 16

Related Questions