Smarty Vue是一種全新的前端渲染引擎，它使用Vue.js作為模板語言，借鑒了PHP模板引擎Smarty的語法特點。通過Smarty Vue實現的前后端分離，在保留PHP的優秀開發經驗基礎上，提高了前端應用的可維護性和擴展性。下面介紹Smarty Vue的基本用法。

首先，要在HTML文件中引入Vue.js和Smarty Vue。可以從官網下載需要的文件并引入，也可以通過CDN鏈接使用。下面是一個示例：

<script src="https://unpkg.com/vue@next"></script>
<script src="https://unpkg.com/smarty-vue"></script>

在HTML中，通過<template>標簽書寫模板：

<template id="app-template">
<div>
{{ message }}
</div>
</template>

在Vue實例中，引用這個模板：

<script>
const app = {
template: '#app-template',
data() {
return {
message: 'Hello, World!'
};
},
};
Vue.createApp(app).mount('#app');
</script>

在運行代碼前，還需要在HTML中指定一個容器：

<div id="app"></div>

最后，在瀏覽器中打開該HTML文件，就可以看到頁面中顯示出了"Hello, World!"這個信息。這是一個非常基本的Smarty Vue應用，可以根據自己的需要定義更復雜的模板。