使用'stylePreprocessorOptions'时，找不到导入文件或无法读取的问题

Question

我是Angular的新手，并且正在使用angular-cli进行示例角度项目。我使用stylePreprocessorOptions文件中的angular.json作为快捷方式来添加额外的基本路径，将通过以下方式对其进行检查。

{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "version": 1,
    "newProjectRoot": "projects",
    "projects": {
        "my-new-angular-app": {
            "root": "",
            "sourceRoot": "src",
            "projectType": "application",
            "prefix": "app",
            "schematics": {
                "@schematics/angular:component": {
                    "style": "scss"
                }
            },
            "architect": {
                "build": {
                    "builder": "@angular-devkit/build-angular:browser",
                    "options": {
                        "outputPath": "dist/my-new-angular-app",
                        "index": "src/index.html",
                        "main": "src/main.ts",
                        "polyfills": "src/polyfills.ts",
                        "tsConfig": "src/tsconfig.app.json",
                        "assets": [
                            "src/favicon.ico",
                            "src/assets"
                        ],
                        "styles": [
                            "src/styles.scss"
                        ],
                        "stylePreprocessorOptions": {
                            "includePaths": [
                                "./src/assets/scss"
                            ]
                        },
                        "scripts": [],
                        "es5BrowserSupport": true
                    },
                    "configurations": {
                        "production": {
                            "fileReplacements": [{
                                "replace": "src/environments/environment.ts",
                                "with": "src/environments/environment.prod.ts"
                            }],
                            "optimization": true,
                            "outputHashing": "all",
                            "sourceMap": false,
                            "extractCss": true,
                            "namedChunks": false,
                            "aot": true,
                            "extractLicenses": true,
                            "vendorChunk": false,
                            "buildOptimizer": true,
                            "budgets": [{
                                "type": "initial",
                                "maximumWarning": "2mb",
                                "maximumError": "5mb"
                            }]
                        }
                    }
                },
                "serve": {
                    "builder": "@angular-devkit/build-angular:dev-server",
                    "options": {
                        "browserTarget": "my-new-angular-app:build"
                    },
                    "configurations": {
                        "production": {
                            "browserTarget": "my-new-angular-app:build:production"
                        }
                    }
                },
                "extract-i18n": {
                    "builder": "@angular-devkit/build-angular:extract-i18n",
                    "options": {
                        "browserTarget": "my-new-angular-app:build"
                    }
                },
                "test": {
                    "builder": "@angular-devkit/build-angular:karma",
                    "options": {
                        "main": "src/test.ts",
                        "polyfills": "src/polyfills.ts",
                        "tsConfig": "src/tsconfig.spec.json",
                        "karmaConfig": "src/karma.conf.js",
                        "styles": [
                            "src/styles.scss"
                        ],
                        "scripts": [],
                        "assets": [
                            "src/favicon.ico",
                            "src/assets"
                        ]
                    }
                },
                "lint": {
                    "builder": "@angular-devkit/build-angular:tslint",
                    "options": {
                        "tsConfig": [
                            "src/tsconfig.app.json",
                            "src/tsconfig.spec.json"
                        ],
                        "exclude": [
                            "**/node_modules/**"
                        ]
                    }
                }
            }
        },
        "my-new-angular-app-e2e": {....}
    },
    "defaultProject": "my-new-angular-app"
}

然后我将导入作为@import 'cvariables';添加到了scss文件中。

但是我遇到了以下错误。

./src/app/footer/footer.component.scss Module build failed (from
./node_modules/sass-loader/lib/loader.js):

 @import 'cvariables'; ^
       File to import not found or unreadable: cvariables.
      in /home/Documents/SampleAngularApps/my-new-angular-app/src/app/footer/footer.component.scss
 (line 1, column 1)

请帮助我找出背后的问题。