??為了實現(xiàn)瀏覽器端運行時解析.vue文件并動態(tài)插入組件，終于找到了一個神器vue3-sfc-loader——可以實現(xiàn)完整的.vue文件解析構(gòu)建尔当，而不只是template莲祸。
image.png
??不要被0.x的版本號和3位數(shù)的周下載誤導(dǎo)了，這個庫已經(jīng)被使用在了大名鼎鼎的
monaco-editor(也就是VSCode)中椭迎。??使用說明和Demo都可以在官網(wǎng)中找到锐帜，本文不再贅述。但就像大部分0.x版本的庫樣畜号，使用細(xì)節(jié)會出現(xiàn)很多問題抹估，這才是本文的主題。
細(xì)節(jié)
- 雖然名字叫
vue3-sfc-loader弄兜，但實際上也可以加載vue2药蜻，或者非vue文件。但是替饿，使用vue2時一定要用
import { loadModule } from 'vue3-sfc-loader/dist/vue2-sfc-loader.js'
而不是
import { loadModule } from 'vue3-sfc-loader'
雖然API一模樣语泽，而且解析template時也沒區(qū)別。但當(dāng)你涉及到script解析時就會出現(xiàn)不可預(yù)知的錯誤视卢。
- 唯一的API —— loadModule(path,options)踱卵，如果要解析vue文件，那么path的路徑后綴一定要以
.vue結(jié)尾 - 對于import的對象，需要通過options中的moduleCache對象進(jìn)行注入惋砂，當(dāng)然這種注入是靜態(tài)的
- 如何動態(tài)注入妒挎，導(dǎo)入自定義文件？ 答：目前不行
