javascript - Nuxt.js v2'de TypeScript ve Option API ile middleware, asyncData, fetch nasıl kullanılır
Option API ile Nuxt.js'e TypeScript'i tanıtmak için çok çalışıyorum.
Mevcut kodda, middleware, asyncData ve fetch yöntemlerini kullanıyoruz. Lang'i ts olarak değiştirdikten sonra (<script lang="ts">), typescript yukarıdaki yöntemler için hata veriyor.
böyle (kod middleware hakkında)
Object literal may only specify known properties, and 'middleware' does not exist in type 'ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<DefaultProps>, DefaultProps>'.
Sonra bu problemi Google'da arattım ve bu çözümü buldum, ama işe yaramıyor, belki de bu çözüm Nuxt ile Class API ile ilgili olduğu için...
.vue dosyamın özeti:
<script lang="ts">
import Vue from 'vue'
export default Vue.extend({
async middleware({store, params, from}) {
// Error is occuring here...
// Object literal may only specify known properties, and 'middleware' does not exist in type 'ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<DefaultProps>, DefaultProps>'.
},
asyncData({params}) {
~~~
},
});
</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,
"baseUrl": ".",
"paths": {
"~/*": [
"./*"
],
"@/*": [
"./*"
]
},
"types": [
"@types/node",
"@nuxt/types"
]
},
"exclude": [
"node_modules"
]
}
Bu yöntemleri Nuxt'ta Option API ile kullanmanın bir yolu var mı?