我有一个带有 Nuxt 和 Typescript 的 Vue2 设置。我正在尝试使用纱线安装 vue-slick-carousel 模块,但 Typescript 给我错误:“找不到模块‘vue-slick-carousel’或其相应的类型声明”。打字稿新手在这里! 当我尝试在组件中导入模块时,会发生此问题:
<script lang="ts">
import Vue from 'vue'
import { VueSlickCarousel } from 'vue-slick-carousel'
export default Vue.extend({
components: {
VueSlickCarousel
}
...
})
</script>
tsconfig.json 文件的内容:
{
"compilerOptions": {
"target": "ES2018",
"module": "ESNext",
"moduleResolution": "Node",
"lib": [
"ESNext",
"ESNext.AsyncIterable",
"DOM"
],
"esModuleInterop": true,
"allowJs": true,
"sourceMap": true,
"strict": true,
"noEmit": true,
"experimentalDecorators": true,
"baseUrl": ".",
"paths": {
"~/*": [
"./*"
],
"@/*": [
"./*"
]
},
"types": [
"@types/node",
"@nuxt/types",
"nuxt-i18n"
]
},
"exclude": [
"node_modules",
".nuxt",
"dist"
]
}
我的 vue-shim.d.ts 文件,不知道要添加什么:
import Vue from 'vue'
declare module 'vue/types/vue' {
interface Vue {
$i18n: {
locale:string,
locales:{code:string, name:string, file:string}[]
}
}
}
我知道问题来自于 Typescript 无法找到模块类型。我找到了一个名为“@types/slick-carousel”的库,它安装了类型,但我不知道下一步该做什么。 我需要手动定义类型吗?
遗憾的是,@types/slick-carousel 包并不是该包的正确类型。你可以通过探索它的index.d.ts来查看它。
您可以在有问题的行上方添加
// @ts-ignore
。不太推荐。将
shims-slick-carousele.d.ts
添加到 src 文件夹
declare module 'vue-slick-carousel' {
import Vue from "vue";
declare class Slick extends Vue {
next(): void;
prev(): void;
play(): void;
pause(): void;
reSlick(): void;
goTo(index: number): void;
}
export default Slick;
}
(类型取自来源)。