使用TypeScript创建Vue项目时,包含两个声明文件:shims-vue.d.ts和shims.tsx.d.ts。
//shims-vue.d.ts
declare module "*.vue" {
import Vue from 'vue';
export default Vue;
}
和:
//shims-tsx.d.ts
import Vue, { VNode } from 'vue';
declare global {
namespace JSX {
// tslint:disable no-empty-interface
interface Element extends VNode {}
// tslint:disable no-empty-interface
interface ElementClass extends Vue {}
interface IntrinsicElements {
[elem: string]: any;
}
}
}
在创建一个小项目(没有Vue CLI)时,我忘记包含第二个项目(shims.tsx.d.ts),并且我的项目可以编译并按预期运行(没有错误)。
我发现了与此相关的帖子:https : //github.com/vuejs/vue-cli/issues/1198,但希望对此进行更多说明。
我很好奇这个文件的作用以及为什么包含它?换句话说,如果我不包括此声明文件,我将不得不“破坏”我的应用程序。
谢谢!
第一个文件可帮助您的IDE理解以什么结尾的文件
.vue
是第二个文件允许您使用
.tsx
文件,同时jsx
在IDE中启用语法支持以编写JSX样式的 TypeScript代码。