我试图将我的简单Angular项目更改为使用sass而不是css，但我得到了以下错误：
contractor-finder-ui@0.0.1build/home/hesamian/WebstormProjects/contractor finder ui/appng构建
ERROR in multi ./src/styles.sass
Module not found: Error: Can't resolve '/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass' in '/home/hesamian/WebstormProjects/contractor-finder-ui/app'
resolve '/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass' in '/home/hesamian/WebstormProjects/contractor-finder-ui/app'
using description file: /home/hesamian/WebstormProjects/contractor-finder-ui/app/package.json (relative path: .)
Field 'browser' doesn't contain a valid alias configuration
using description file: /home/hesamian/WebstormProjects/contractor-finder-ui/app/package.json (relative path: ./src/styles.sass)
no extension
Field 'browser' doesn't contain a valid alias configuration
/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass doesn't exist
.ts
Field 'browser' doesn't contain a valid alias configuration
/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass.ts doesn't exist
.tsx
Field 'browser' doesn't contain a valid alias configuration
/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass.tsx doesn't exist
.mjs
Field 'browser' doesn't contain a valid alias configuration
/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass.mjs doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass.js doesn't exist
as directory
/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass doesn't exist
[/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass]
[/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass.ts]
[/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass.tsx]
[/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass.mjs]
[/home/hesamian/WebstormProjects/contractor-finder-ui/app/src/styles.sass.js]
@ multi ./src/styles.sass styles[0]
我的angular.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"contractor-finder-ui": {
"projectType": "application",
"schematics": {
"@schematics/angular:component": {
"style": "sass"
}
},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/contractor-finder-ui",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.app.json",
"aot": false,
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.sass"
],
"scripts": []
},
"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"
},
{
"type": "anyComponentStyle",
"maximumWarning": "6kb",
"maximumError": "10kb"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "contractor-finder-ui:build"
},
"configurations": {
"production": {
"browserTarget": "contractor-finder-ui:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "contractor-finder-ui:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.sass"
],
"scripts": []
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"tsconfig.app.json",
"tsconfig.spec.json",
"e2e/tsconfig.json"
],
"exclude": [
"**/node_modules/**"
]
}
},
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "contractor-finder-ui:serve"
},
"configurations": {
"production": {
"devServerTarget": "contractor-finder-ui:serve:production"
}
}
}
}
}
},
"defaultProject": "contractor-finder-ui",
"schematics": {
"@schematics/angular:component": {
"styleext": "sass"
}
}
}
我的文件夹结构：
./
├── angular.json
├── browserslist
├── dist
├── e2e
│ ├── protractor.conf.js
│ ├── src
│ │ ├── app.e2e-spec.ts
│ │ └── app.po.ts
│ └── tsconfig.json
├── karma.conf.js
├── package.json
├── package-lock.json
├── src
│ ├── app
│ │ ├── app.component.html
│ │ ├── app.component.sass
│ │ ├── app.component.ts
│ │ ├── app.module.ts
│ │ ├── app-routing.module.ts
│ │ ├── components
│ │ │ ├── account
│ │ │ │ ├── login
│ │ │ │ │ ├── login.component.html
│ │ │ │ │ ├── login.component.sass
│ │ │ │ │ └── login.component.ts
│ │ │ │ ├── logout
│ │ │ │ │ ├── logout.component.html
│ │ │ │ │ ├── logout.component.sass
│ │ │ │ │ └── logout.component.ts
│ │ │ │ └── register
│ │ │ │ ├── register.component.html
│ │ │ │ ├── register.component.sass
│ │ │ │ └── register.component.ts
│ │ │ ├── board
│ │ │ │ ├── board.component.html
│ │ │ │ ├── board.component.sass
│ │ │ │ └── board.component.ts
│ │ │ ├── common
│ │ │ │ ├── http-intercept
│ │ │ │ │ ├── http-intercept.component.html
│ │ │ │ │ ├── http-intercept.component.sass
│ │ │ │ │ └── http-intercept.component.ts
│ │ │ │ └── wrapper
│ │ │ │ ├── common.component.html
│ │ │ │ ├── common.component.sass
│ │ │ │ └── common.component.ts
│ │ │ └── contractor
│ │ │ ├── index
│ │ │ │ ├── contractor.index.component.html
│ │ │ │ ├── contractor.index.component.sass
│ │ │ │ └── contractor.index.component.ts
│ │ │ ├── save
│ │ │ │ ├── contractor.save.component.html
│ │ │ │ ├── contractor.save.component.sass
│ │ │ │ └── contractor.save.component.ts
│ │ │ └── update
│ │ │ ├── contractor.update.component.html
│ │ │ ├── contractor.update.component.sass
│ │ │ └── contractor.update.component.ts
│ │ ├── constants
│ │ │ └── api.ts
│ │ ├── intercepters
│ │ │ └── jwt.intercepter.ts
│ │ ├── models
│ │ │ ├── Account.ts
│ │ │ ├── authentication.service
│ │ │ │ ├── login
│ │ │ │ │ ├── LoginRequest.ts
│ │ │ │ │ └── LoginResponse.ts
│ │ │ │ └── register
│ │ │ │ ├── RegisterRequest.ts
│ │ │ │ └── RegisterResponse.ts
│ │ │ └── Contractor.ts
│ │ ├── modules
│ │ │ ├── account.module.ts
│ │ │ ├── board.module.ts
│ │ │ ├── common.module.ts
│ │ │ └── contractor.module.ts
│ │ ├── RouterConfig.ts
│ │ ├── services
│ │ │ ├── abstracts
│ │ │ │ └── crud.service.ts
│ │ │ ├── authentication.service.ts
│ │ │ └── contractor.service.ts
│ │ └── utilities
│ │ ├── custom.error.handler.utility.ts
│ │ ├── custom.reuse.strategy.utility.ts
│ │ └── route.utility.ts
│ ├── assets
│ ├── environments
│ │ ├── environment.prod.ts
│ │ └── environment.ts
│ ├── favicon.ico
│ ├── index.html
│ ├── main.ts
│ ├── polyfills.ts
│ └── test.ts
├── tsconfig.app.json
├── tsconfig.json
├── tsconfig.spec.json
├── tslint.json
└── yarn.lock
项目中的文件夹src中没有文件styles.sass。