Vue.js mount(‘#app’)がマウントされているファイル
Vue.jsで、基本的なことですがvue/cliで作成されたmain.js内にあるappがマウントされているファイルの場所を記述してます。
環境
- OS windows10 64bit
- vue 3.0.0
- node v14.6.0
- npm 6.14.6
- @vue/cli 4.5.9
ファイル場所
main.js内に記述されている「mount(‘#app’)」がマウントしてるidが記述されているファイルは
import { createApp } from 'vue'
import App from './App.vue'
createApp(App).mount('#app')publiフォルダ内にある「index.html」にあります。
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>なので、index.htmlを以下のように変更して、
<div id="appnew"></div>main.jsを
import { createApp } from 'vue'
import App from './App.vue'
createApp(App).mount('#appnew')とすると、レイアウトは少し崩れますが、初期状態のままだと、ちゃんと以下のページが表示されます。
-
前の記事
docker composeを使ってApache Sparkを構築する 2021.01.04
-
次の記事
javascript canvasタグに四角形を作成する 2021.01.05