Repository navigation
scss not compiled with the latest aot configuration #1310
Description
Note: for support questions, please use one of these channels: Chat: AngularClass.slack or Twitter: @AngularClass
-
I'm submitting a ...
[x] bug report
[ ] feature request
[ ] question about the decisions made in the repository -
What is the current behavior?
I am currently adjusting my code for the AOT compilation but I have an issue with my scss. (im also using sass loader with webpack)
Here is the compilation error :
Error: Compilation failed. Resource file not found: /home/bsousa/Projects/email-builder/src/app/sass/mixins.scss
at ModuleResolutionHostAdapter.readResource (/home/bsousa/Projects/email-builder/node_modules/@angular/compiler-cli/src/compiler_host.js:270:19)
at CompilerHost.loadResource (/home/bsousa/Projects/email-builder/node_modules/@angular/compiler-cli/src/compiler_host.js:230:85)
see #1304
- What is the expected behavior?
It should compiled everything with node sass.
- Please tell us about your environment:
- Angular version: 2.4.1
Activity
shlomiassaf commentedon Dec 29, 2016
@BkSouX , This is a SCSS file referenced in a component's
styleUrls, right?Please give more info...
shlomiassaf commentedon Dec 29, 2016
I can only guess since there's not a lot of information...
But it looks like you're trying to load a global scss file from within a component styleUrls... right?
feddyups commentedon Dec 30, 2016
@shlomiassaf : You are correct, this happens also in my case, the scss files are being loaded directly through the component's styleUrls.
An Idea would be to configure the
test: /\.scss$/rule to work with"extract-text-webpack-plugin": "^2.0.0-beta.4",so we can extract css files into the components' dirs and change ourtemplateUrlreference to point to this?shlomiassaf commentedon Dec 31, 2016
@feddyups No,
test: /\.scss$/is to generic, it will take all SCSS files and send them to the header.There are 2 types of stylesheets in an angular 2 application
Each component has a
ViewEncapsulationproperty that defines the interaction of the styles so it's important to have SCSS files stay within the component.Global styles can be in a specific app or prefixed, it's up to you actually (see #1304 and comments)
@BkSouX The error you posted indicates that the
@angular/compilertried to fetch a resource that was in thestyleUrlsof a component but it wasn't there.This error also indicates that you are using an older version of this repo since this resource is loaded by the
compiler-cliand notngc-webpackAnyway, if the file is not present
ngc-webpackwill throw as well...check your files...