Vue 模板
在 Vue 中，我們稱 **template** 為我們 Vue 應用程式的 HTML 部分。
<template> 標籤稍後將在 *.vue 檔案中使用，以更好地組織我們的程式碼。
可以使用 **template** 作為 Vue 例項中的一個配置選項，並將 HTML 程式碼放在其中。
Vue 模板
讓我們看一個使用 'template' 作為配置選項的例子。這是一個簡單的例子，我們只是將 HTML 部分移到了配置選項 'template' 中
示例
來自 <div id="app"> 內部的 HTML 內容被移到了配置選項 'template' 中，並用反引號 `...` 包圍。我們可以在反引號內編寫多行 HTML。
<div id="app"></div>
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script>
const app = Vue.createApp({
template
`<h1>{{ message }}</h1>
<p>這是第二行 HTML 程式碼，在反引號內</p>`，
data() {
return {
message: "Hello World!"
}
}
})
app.mount('#app')
</script>
自己動手試一試 »
單檔案元件 (SFC)
正如您在上面的程式碼示例中所看到的，我們的 Vue 應用程式的 HTML 部分也可以聚集在 Vue 例項內部，但這並沒有讓 HTML 檔案更容易概覽。
為了獲得更好的概覽，為了更容易處理大型專案，並獲得更好的開發環境，我們現在將切換到在 SFC，或 *.vue 檔案中編寫我們的 Vue 程式碼。
所有 *.vue 檔案只包含三個部分
<template>包含 HTML 內容。<script>包含我們的 Vue 程式碼。<style>包含 CSS 樣式。
但在我們可以在專案中開始使用 *.vue 檔案之前，我們需要以不同的方式設定我們的計算機。本教程的下一頁將解釋這一點。
