以角度从`sass`更新到`scss`答案

【问题标题】：updating from `sass` to `scss` in angular以角度从`sass`更新到`scss`
【发布时间】：2018-04-25 14:49:34
【问题描述】：

当我创建我的 Angular 应用程序时，我将参数用作 --style=sass 但我会切换到 scss 再次运行 ng set defaults.styleExt scss 并将所有文件扩展为 .scss。

但仍然出现错误：

ERROR in ./src/app/app.component.ts
Module not found: Error: Can't resolve './app.component.sass' in 'C:\DHL\Projects\retailApp\src\app'
ERROR in ./src/app/footer/footer.component.ts
Module not found: Error: Can't resolve './footer.component.sass' in 'C:\DHL\Projects\retailApp\src\app\footer'
ERROR in ./src/app/header/header.component.ts
Module not found: Error: Can't resolve './header.component.sass' in 'C:\DHL\Projects\retailApp\src\app\header'
ERROR in ./src/app/pages/home/home.component.ts
Module not found: Error: Can't resolve './home.component.sass' in 'C:\DHL\Projects\retailApp\src\app\pages\home'
ERROR in multi ./src/assets/css/reset.css ./src/styles.sass
Module not found: Error: Can't resolve 'C:\DHL\Projects\retailApp\src\assets\css\reset.css' in 'C:\DHL\Projects\retailApp'
ERROR in multi ./src/assets/css/reset.css ./src/styles.sass
Module not found: Error: Can't resolve 'C:\DHL\Projects\retailApp\src\styles.sass' in 'C:\DHL\Projects\retailApp'

这里有什么问题？谁来帮帮我

【问题讨论】：

标签： angular sass angular-cli

【解决方案1】：

根据错误，这将更改所有文件扩展名，但不会更改导入。因此，您需要像这样手动将所有组件中的所有导入从sass 更改为scss

@Component({
  ........
  styleUrls: [ './marketing.component.scss' ] // change here
   ............
})

【讨论】：

【解决方案2】：

您的所有文件都引用了 SASS 文件。

您需要打开其中声明的每个文件，然后查看类的装饰器，看起来像这样

@Component({
  selector: 'XX'
  templateUrl: XXX.html
  styleUrls: ['XX.sass']
})
export class XXX {}

将sass 替换为scss，你应该会很好。

【讨论】：