一、如何在Webpack中使用Vue？

 這裡的意思就是說把Vue當做一個模組來使用，那我們就要先安裝這個模組：

 看一下會發現其實上面的程式碼不就是普通的js程式碼嗎，我們現在還沒有寫.vue的程式碼，按道理也是可以可以正常渲染打包的。

會發現現在打包是沒有問題的，但是沒有渲染成功，控制檯報如下警告：

 為什麼會報這個警告呢？

因為上面程式碼中的template最終是要通過Vue原始碼進行解析的，但是Vue的原始碼給我們提供了特別多的版本，所有的版本又分為兩類：

①runtime-compiler 執行時+編譯器

②runtime-only 僅執行時

如果沒有template，那麼可以用runtime-only。

而compiler最主要的功能就是對template進行編譯的。

但是預設用的是runtime-only，所以編譯不成功。

 這樣寫一下;

現在就渲染成功了：

 二、叫啥名字吶

在真實開發中我們不可能在createApp中編寫很多template的。

 也可以渲染成功。

但是現在的問題是template和js和樣式是分開的。也就是SFC檔案。

二、VSCode對SFC檔案的支援

 三、App.vue

現在對檔案進行一個改寫:

 很顯然是打包不成功的：

 安裝vue-loader：

 配置：

 但是這次打包也會報錯.安裝@vue/compiler-sfc 

 此時打包還是會報錯：

 執行下面步驟：

 現在再打包就沒問題了!

另外.vue中的template會有vue-loader中的@vue/complier-sfc解析的，所以：