當我們在使用Vue構建Web應用時，使用SCSS來管理樣式表是非常方便的。SCSS提供了許多有用的功能，例如變量、嵌套、混合器、繼承等等。在Vue中，我們可以使用webpack來編譯SCSS文件，實現樣式表的引入。

首先，我們需要安裝sass和sass-loader兩個庫，這可以在終端中使用npm來完成。在項目根目錄下，使用以下命令安裝這兩個依賴項。

npm install sass sass-loader --save-dev

使用了sass-loader之后，我們就可以在Vue的單文件組件中使用標簽了。在這個標簽中，我們可以編寫SCSS代碼。例如，我們可以定義一個變量$main-color，并給它賦值為灰色。

然而，有時候我們需要在多個組件中使用相同的變量，這時候SCSS中的全局變量就非常有用了。在Vue項目根目錄下創建一個scss文件夾，并在其中創建一個_variables.scss文件。在這個文件中，我們定義全局變量并導出它們：

$primary-color: #1890ff;
$secondary-color: #52c41a;
$error-color: #f5222d;
:export {
primary-color: $primary-color;
secondary-color: $secondary-color;
error-color: $error-color;
}

在Vue項目的webpack配置文件中，我們可以將這些全局變量導入到每個單文件組件中。在webpack.config.js文件中添加以下代碼：

module.exports = {
// ...其他配置項
module: {
rules: [
// ...其他rules
{
test: /\.scss$/,
use: [
{
loader: 'sass-loader',
options: {
additionalData: "@import '@/scss/_varibles.scss';"
},
},
],
},
],
},
};

在這個配置中，我們使用sass-loader并添加了一個options對象。這個對象有一個additionalData屬性，其值是SCSS中導入_variables.scss文件的路徑。

最后，在單文件組件中引入SCSS文件并使用其中的變量。在Vue組件的標簽中，我們可以這樣寫：

這里，我們使用@import語句導入了_variables.scss文件。在組件中的其他樣式定義中，可以使用定義在這個文件中的全局變量。

總之，使用SCSS管理Vue項目的樣式表可以提高代碼的可讀性和維護性。在webpack中使用sass-loader配置，可以讓我們更加方便的使用SCSS并在組件中導入全局變量。