如何将Typescript与Laravel Mix和Vue SFC一起使用？

在使用Laravel Mix时，是否可以在Vue单文件组件（SFC）中使用Typescript

如果是，应如何设置

我目前正在使用LaravelMix5.0、TypeScript3.7.5和Vue2.5.17

我有一个用Typescript编写的单个文件组件，例如

SingleFileComponent.vue

：

<template>
  <div>
    <ul
        v-for="item in items"
        v-bind:key="item.id">
        <li>{{ item.message }}</li>
    </ul>
  </div>
</template>
<script lang="ts">
import Axios from 'axios';

export default {
  data() {
    return {
      items: [],
    }
  },
  mounted() {
    Axios.get('/api/get-stuff').then(res => {
      this.items = res.data;
    })
  },
}
</script>

运行

npm run watch

会导致以下错误：

ERROR in /path-to-file/SingleFileComponent.vue.ts
[tsl] ERROR in /path-to-file/SingleFileComponent.vue.ts(21,12)
  TS2339: Property 'items' does not exist on type '{ data(): { items: never[]; }; mounted(): void; }'.

---

将SFC与Typescript一起使用时，应

扩展
：

<script lang="ts">
import Axios from 'axios';
import Vue from 'vue';

export default Vue.extend({
  ...
})
</script>


从“Axios”导入Axios；
从“Vue”导入Vue；
导出默认Vue.extend({
...
})

<script lang="ts">
import Axios from 'axios';
import Vue from 'vue';

export default Vue.extend({
  ...
})
</script>