I recently integrated TypeScript into Nuxt using the guidelines provided in the documentation:
However, I have a specific question regarding component setup. Should I always include import vue from "vue"
and export default Vue.extend ({});
in all components? The documentation shows an example with one component (), but I'm unsure if this is necessary for every component or if there's a more global approach.
I initially believed that my types/vue-shim.d.ts
file handled this configuration for me, but it seems like my understanding was incorrect.
vue-shim.d.ts
:
import Vue from "vue";
declare module "*.vue" {
import Vue from "vue";
export default Vue;
}
Prior to adding TypeScript to Nuxt, my components looked like this:
<script>
import comp from "../component.vue";
export default {
components: {
comp
},
data() {
return {
createUser: true,
params: {
rol_id: 0,
post_url: "",
update_url: ""
}
};
},
mounted() {
this.params.post_url = this.$config.routePrefix + "/agency/";
this.params.update_url = this.$config.routePrefix + "/agency/";
if (this.$route.params.uuid !== undefined) {
this.createUser = false;
}
},
methods: {
fetchForms() {}
}
};
</script>