For my Angular 4.0.2 Universal App I have a component (BlogComponent) with:
@Component({
templateUrl: 'blog.component.html',
styleUrls: ['blog.component.scss']
})
Within the stylesheet, I have:
@import '../../styles';
File structure:
/src
styles.scss
/app
/blog
blog.component.scss
i.e. main stylesheet in root and component stylesheet in app/blog
When I run npm start I get:
Error: Compilation failed. Resource file not found: C:/Users/robba/Angular4/robbailey3/src/styles
at ModuleResolutionHostAdapter.readResource (C:\Users\robba\Angular4\robbailey3\node_modules\@angular\compiler-cli\src\compiler_host.js:370:19)
at CompilerHost.loadResource (C:\Users\robba\Angular4\robbailey3\node_modules\@angular\compiler-cli\src\compiler_host.js:243:85)
at Object.get (C:\Users\robba\Angular4\robbailey3\node_modules\@angular\compiler\bundles\compiler.umd.js:24640:107)
at DirectiveNormalizer._fetch (C:\Users\robba\Angular4\robbailey3\node_modules\@angular\compiler\bundles\compiler.umd.js:13297:45)
at C:\Users\robba\Angular4\robbailey3\node_modules\@angular\compiler\bundles\compiler.umd.js:13426:53
at Array.map (native)
at DirectiveNormalizer._loadMissingExternalStylesheets (C:\Users\robba\Angular4\robbailey3\node_modules\@angular\compiler\bundles\compiler.umd.js:13426:14)
at C:\Users\robba\Angular4\robbailey3\node_modules\@angular\compiler\bundles\compiler.umd.js:13429:26
at process._tickCallback (internal/process/next_tick.js:109:7)
at Module.runMain (module.js:607:11)
Compilation failed
However, the import statement works fine when I use ng serve.
How do I get the @import statement to work for npm start or npm build?