vue + ts中的shims-vue.d.ts文件的作用,在ts中引入vue-echarts等vue文件 TypeScript 導入 JSON Module --resolveJsonModule


 

shims-vue.d.ts是為了 typescript 做的適配定義文件,因為.vue 文件不是一個常規的文件類型,ts 是不能理解 vue 文件是干嘛的,
加這一段是是告訴 ts,vue 文件是這種類型的。
這一段刪除,會發現 import 的所有 vue 類型的文件都會報錯。

/**
* shims-vue.d.ts的作用
* 為了 typescript 做的適配定義文件,因為.vue 文件不是一個常規的文件類型,ts 是不能理解 vue 文件是干嘛的,
* 加這一段是是告訴 ts,vue 文件是這種類型的。
* 可以把這一段刪除,會發現 import 的所有 vue 類型的文件都會報錯。
*/

declare module '*.vue' { //declare聲明宣告, 聲明一個ambient module(即:沒有內部實現的 module聲明)
import Vue from 'vue'
export default Vue
}
// typings.d.ts

declare module '*.json' {
    const value: any;
    export default value;
}



import json from 'src/assets/json/users.json'

 

declare module 'vue-echarts' // 引入vue-echarts

<script lang="ts">
/* eslint-disable @typescript-eslint/camelcase */
import { Vue, Component, Watch } from 'vue-property-decorator'
import ECharts from 'vue-echarts' //報錯,按上面的方法在shims-vue.d.ts文件中引入即可
import 'echarts/lib/chart/line'
import 'echarts/lib/chart/pie'
import 'echarts/lib/component/tooltip'
</script>
————————————————
版權聲明:本文為CSDN博主「小小前端--可笑可笑」的原創文章,遵循CC 4.0 BY-SA版權協議,轉載請附上原文出處鏈接及本聲明。
原文鏈接:https://blog.csdn.net/qq_41860203/article/details/110912759


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM