在Vue项目中引入SCSS文件，您可以选择全局引入或局部引入的方式：

全局引入

1. 在项目的入口文件main.js中引入SCSS文件。这样，SCSS样式将在全局范围内生效。使用import语句来引入SCSS文件：

   import './assets/scss/index.scss';
   

   这里的路径应该根据您项目中SCSS文件的实际位置进行调整。

局部引入

1. 在单文件组件（.vue文件）中，您可以在<style>标签中使用lang="scss"属性来指定使用SCSS预处理器。然后，您可以直接在这个标签内编写SCSS代码，或者使用@import语句引入外部SCSS文件：

   <template>
     <!-- 组件模板内容 -->
   </template>
   
   <script>
     // JavaScript代码
   </script>
   
   <style lang="scss">
     @import "./path-to-your-styles.scss";
     // 其他SCSS样式
   </style>
   

   在这种情况下，SCSS样式只会应用于当前组件[1][5]。

配置Webpack

为了使Vue项目能够处理SCSS文件，您需要确保已经安装了相应的加载器，如sass-loader和node-sass或sass（Dart Sass）：

npm install sass-loader sass --save-dev

或者，如果您使用的是node-sass：

npm install sass-loader node-sass --save-dev

在Vue CLI创建的项目中，通常已经配置好了对应的Webpack配置，所以您只需要安装必要的依赖即可开始使用SCSS。

使用SCSS全局变量

如果您想在项目中全局使用SCSS变量，可以通过配置Webpack的sass-loader选项来实现。在vue.config.js文件中，您可以添加如下配置：

module.exports = {
  css: {
    loaderOptions: {
      sass: {
        additionalData: `@import "@/styles/variables.scss";`
      }
    }
  }
};

这里的@import路径应该根据您的项目结构和文件位置进行调整。这样配置后，您就可以在项目中的任何组件内直接使用这些全局变量，而无需在每个组件中单独导入它们。

请注意，根据您的项目配置和Vue CLI版本，具体的步骤和配置可能会有所不同。您可能需要参考官方文档或搜索更多资源来适配您的项目需求。