(当たり前として捉えられているのかは知らないが)意外とこれ解説してる記事がどこにもなかったので、自分なりの見解を記載。
環境:
PC:mac book pro
バージョン:Vue.js 3
エディタ:VSCode
前提:
・Vue.js環境周りを全て設定完了
・(設定直後で)ファイルは何もいじっていない
・localhost:8080でサーバ起動できる
上記前提を元に以下ファイルを見ていったときに疑問が1つ。
main.js
import { createApp } from 'vue' ⇦こいつ
import App from './App.vue'
createApp(App).mount('#app')
2行目はまぁ、App.vueをmain.jsにインポートしてるってだけの話だからいいとして、
1行目のこいつ。createAppはただの関数名(予約語という訳でもなく)と思われるのでここは問題ない。
createAppは関数であるものの、'vue'って何??
そんなファイルどこにもないぞ??
何者だこいつ???
ってことで自分なりに考えて見た結果、、
・'vue'は拡張子を指している(vueというファイルがない以上、それ以外に捉えようがない)
・createApp(App)で、拡張子が'vue'になっているファイルを受付けてくれるようになる。
・最終的に、createApp(App)によって、拡張子'vue'のファイルをHTML用に変換し、mount('#app')で、html側で指定したid='app'のタグに対してhtmlとして出力される。
この解釈であれば、必要な分だけvueファイルをhtml側に出力することが可能になることが分かる。
もし、解釈が間違っていたら遠慮なく指摘してほしい。