shims-tsx.d.ts文件在Vue-Typescript项目中做什么?

TypeScript Vue.js

GreenNear

2020-03-14

使用TypeScript创建Vue项目时,包含两个声明文件:shims-vue.d.tsshims.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,但希望对此进行更多说明。

我很好奇这个文件的作用以及为什么包含它?换句话说,如果我不包括此声明文件,我将不得不“破坏”我的应用程序。

谢谢!

第1619篇《shims-tsx.d.ts文件在Vue-Typescript项目中做什么?》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

1个回答
Davaid神奇Eva 2020.03.14

第一个文件可帮助您的IDE理解以什么结尾的文件.vue

第二个文件允许您使用.tsx文件,同时jsx在IDE中启用语法支持以编写JSX样式的 TypeScript代码。

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android