在 Vue 中使用 Less 是一種流行的 CSS 預處理器，它可以讓我們更加靈活地管理樣式，使用變量、嵌套等語言特性，并生成更加易于維護的樣式代碼。下面我們將介紹在 Vue 中如何使用 Less。

首先，我們需要安裝 Less 和 Less-loader。

npm install less less-loader -D

然后，在項目中找到 vue.config.js 文件（如果沒有則在項目根目錄創建一個），并添加以下代碼：

module.exports = {
css: {
loaderOptions: {
less: {
javascriptEnabled: true
}
}
}
}

這樣就配置好了 Less，現在我們可以在 Vue 組件中使用 Less 編寫樣式了。以下是一個簡單的例子：

< template >< div class="hello" >{{ msg }}< /div>< /template >< style lang="less" >.hello {
color: @color;
}< /style >

在這個例子中，我們使用了 Less 的語法特性，定義了 @color 變量并將它應用到了 .hello 元素的 color 屬性上。

需要注意的是，在使用 Less 的語法時，我們需要給