我有以下專案結構。
folder/
├─ projectA/
│ ├─ src/
│ │ ├─ views/
│ │ │ ├─ HomeView.vue
│ ├─ package.json
├─ projectB/
├─ shared/
│ ├─ HelloWorld.vue
ProjectA和ProjectB是在命令的幫助下創建的獨立專案：
-> vue create ...
shared - 一個應該只包含 files.vue 的檔案夾 - 可以在專案 A 和專案 B 中使用的組件。
HomeView.vue（來自projectA ）組件嘗試使用HelloWorld.vue （來自共享檔案夾）組件。
主視圖.vue
<script lang="ts">
import { defineComponent } from 'vue'
import HelloWorld from '../../../shared/HelloWorld.vue' // @ is an alias to /src
export default defineComponent({
name: 'HomeView',
components: {
HelloWorld
}
})
你好世界.vue
<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
name: 'HelloWorld',
props: {
msg: String
}
})
</script>
如果HelloWorld.vue “components”檔案夾中projectA中的 vue 組件，一切都會正常作業（匯入路徑會略有變化）。但是當我嘗試將此組件輸出到共享檔案夾時，出現以下錯誤：
ERROR in ../shared/HelloWorld.vue:37:33
TS2307: Cannot find module 'vue' or its corresponding type declarations.
35 |
36 | <script lang="ts">
> 37 | import { defineComponent } from 'vue'
| ^^^^^
38 |
39 | export default defineComponent({
40 | name: 'HelloWorld',
如何修復錯誤并使專案外部的組件正常作業？
從檔案中：
“為什么人們不能直接使用我的 .vue 檔案？這不是最簡單的組件共享方式嗎？” 確實，您可以直接共享 .vue 檔案，任何使用包含 Vue 編譯器的 Vue 構建的人都可以立即使用它。
uj5u.com熱心網友回復：
錯誤訊息是不言自明的：
TS2307: Cannot find module 'vue' or its corresponding type declarations.
> 37 | import { defineComponent } from 'vue'
在共享檔案夾中，沒有vue依賴，所以 HelloWorld 無法匯入。如果您檢查在 npm 上發布的任何 vue 組件庫，您會看到它們有一個package.json檔案，您可以在其中找到 vue 依賴項。
我建議您簡單地復制專案中的組件，或者您花費更長但更有益的路徑來創建您自己的帶有 vue 組件的npm 包。你可以從這里開始。（免責宣告：我沒有按照文章中的步驟進行操作，但乍一看還不錯，應該可以讓您大致了解該程序）
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/522087.html
標籤：打字稿成分Vuejs3
上一篇：是否可以在一個類中實作部分介面，而在子類中實作其余介面？
下一篇：如何使打字稿考慮對資料型別的過濾