Scss build fails because of shim.ngstyle.js not found

🐞 Bug report

Command (mark with an `x`)

- [ ] new
- [ x] build
- [ ] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Is this a regression?

This bug was not present in previous versions.

Description

Sometimes (I can't say what triggers it but for sure when there were changes in scss file) while building a project (with --aot flag, I didn't have checked either the bug occurs without it) (scss file).shim.ngstyle.js is not to be found and after serving again no errors occur.

A clear and concise description of the problem...

🔬 Minimal Reproduction

1.make changes in scss file
2. ng s --aot
On some repetition, it will happen.

🔥 Exception or Error




ERROR in ./src/app/modules/patients/components/patient-details/patient-evaluation/goals/goals-content/goals-content.component.scss.shim.ngstyle.js
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: ENOENT: no such file or directory, open 'C:\Users\user\Desktop\projekt\portal\src\app\modules\patients\components\patient-details\patient-evaluation\goals\goals-content\goals-content.component.scss.shim.ngstyle.js'
    at Object.openSync (fs.js:438:3)
    at Object.readFileSync (fs.js:343:35)
    at Storage.provideSync (C:\Users\user\Desktop\projekt\portal\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:98:13)
    at CachedInputFileSystem.readFileSync (C:\Users\user\Desktop\projekt\portal\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:259:32)
    at Observable.rxjs_1.Observable.obs [as _subscribe] (C:\Users\user\Desktop\projekt\portal\node_modules\@ngtools\webpack\src\webpack-input-host.js:35:51)
    at Observable._trySubscribe (C:\Users\user\Desktop\projekt\portal\node_modules\@ngtools\webpack\node_modules\rxjs\internal\Observable.js:44:25)
    at Observable.subscribe (C:\Users\user\Desktop\projekt\portal\node_modules\@ngtools\webpack\node_modules\rxjs\internal\Observable.js:30:22)
    at SyncDelegateHost._doSyncCall (C:\Users\user\Desktop\projekt\portal\node_modules\@angular-devkit\core\src\virtual-fs\host\sync.js:22:20)
    at SyncDelegateHost.read (C:\Users\user\Desktop\projekt\portal\node_modules\@angular-devkit\core\src\virtual-fs\host\sync.js:49:21)
    at WebpackCompilerHost.readFileBuffer (C:\Users\user\Desktop\projekt\portal\node_modules\@ngtools\webpack\src\compiler_host.js:147:44)
    at VirtualFileSystemDecorator.readFile (C:\Users\user\Desktop\projekt\portal\node_modules\@ngtools\webpack\src\virtual_file_system_decorator.js:42:54)
    at processResource (C:\Users\user\Desktop\projekt\portal\node_modules\loader-runner\lib\LoaderRunner.js:202:11)
    at iteratePitchingLoaders (C:\Users\user\Desktop\projekt\portal\node_modules\loader-runner\lib\LoaderRunner.js:158:10)
    at iteratePitchingLoaders (C:\Users\user\Desktop\projekt\portal\node_modules\loader-runner\lib\LoaderRunner.js:165:10)
    at C:\Users\user\Desktop\projekt\portal\node_modules\loader-runner\lib\LoaderRunner.js:176:18
    at loadLoader (C:\Users\user\Desktop\projekt\portal\node_modules\loader-runner\lib\loadLoader.js:47:3)
i ｢wdm｣: Failed to compile.

🌍 Your Environment




Angular CLI: 8.3.0
Node: 10.15.3
OS: win32 x64
Angular: 8.2.3
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.802.2
@angular-devkit/build-angular     0.802.2
@angular-devkit/build-optimizer   0.802.2
@angular-devkit/build-webpack     0.802.2
@angular-devkit/core              8.2.2
@angular-devkit/schematics        8.3.0
@angular/cli                      8.3.0
@ngtools/webpack                  8.2.2
@schematics/angular               8.3.0
@schematics/update                0.803.0
rxjs                              6.5.2
typescript                        3.4.5
webpack                           4.39.2

Anything else relevant?

i had the same problem, i just only change one line in component.csss

Angular CLI: 8.2.2
Node: 11.15.0
OS: linux x64
Angular: 8.2.2

Package Version

@angular-devkit/architect 0.802.2
@angular-devkit/build-angular 0.802.2
@angular-devkit/build-optimizer 0.802.2
@angular-devkit/build-webpack 0.802.2
@angular-devkit/core 8.2.2
@angular-devkit/schematics 8.2.2
@angular/http 7.2.15
@ngtools/webpack 8.2.2
@schematics/angular 8.2.2
@schematics/update 0.802.2
rxjs 6.4.0
typescript 3.5.3
webpack 4.38.0
`

I Found a solution

in cmd.exe

echo > C:\Users\user\Desktop\projekt\portal\src\app\modules\patients\components\patient-details\patient-evaluation\goals\goals-content\goals-content.component.scss.shim.ngstyle.js

create the file and rebuild

It's not a good solution as it happens randomly to any edited scss file. Also, the problem is not that it's impossible to build, as it occurs only once in a while and usually after one rebuild it works fine. Your fix (even if It would work) is more of a hack than an actual solution to the problem.

It's not a good solution as it happens randomly to any edited scss file. Also, the problem is not that it's impossible to build, as it occurs only once in a while and usually after one rebuild it works fine. Your fix (even if It would work) is more of a hack than an actual solution to the problem.

yo're right, iknow that is not a solution of the real problem, but work if u dont have time to the patch

This seems to be related to a race condition when saving re-saving a file while a compilation has not yet finished.

Same issue with 8.2.5

I have often encountered this annoying problem since 8.0.

This seems to be related to a race condition when saving re-saving a file while a compilation has not yet finished.

This seems to be only acceptable reason for this issue.
I am facing the same, while using the ng serve with --aot

after sass file build fail, any file save or change won't trigger another incremental rebuild until restart build service

This is happening several times a day for me (using mostly LESS, not SCSS), and it definitely sucks a lot to have to restart ng serve --aot all the time again, esp. when it takes more than 1 minute to complete for our rather large project.

I was able to reproduce this by following these steps:

npm install -g @angular/cli@9.0.0-next.5
ng new scss-app --style=scss
cd scss-app
# add `"enableIvy": false,` inside `angularCompilerOptions` in `tsconfig.json`
ng serve --aot
# open `src/app/app.component.scss`, paste and save `h1 {color: black} ` dozens of times at difference paces

Trying to figure out what's happening.

fix(@ngtools/webpack): don't delete virtual files for resources still…

#15702 should fix it, hopefully out in the next patch version.

fix(@ngtools/webpack): don't delete virtual files for resources still…

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

fix(@ngtools/webpack): don't delete virtual files for resources still…

Navigation Menu

Repository navigation

Scss build fails because of shim.ngstyle.js not found #15453

🐞 Bug report

Command (mark with an `x`)

Is this a regression?

Description

🔬 Minimal Reproduction

🔥 Exception or Error

🌍 Your Environment

Package Version

8 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Scss build fails because of shim.ngstyle.js not found #15453

Description

🐞 Bug report

Command (mark with an x)

Is this a regression?

Description

🔬 Minimal Reproduction

🔥 Exception or Error

🌍 Your Environment

Activity

nullr00tbyte commented on Aug 27, 2019

Package Version

nullr00tbyte commented on Aug 27, 2019

Kaspazza commented on Aug 27, 2019

nullr00tbyte commented on Aug 27, 2019

alan-agius4 commented on Aug 28, 2019

8 remaining items

phantomk commented on Sep 20, 2019

Y2zz commented on Sep 21, 2019

sanket-work commented on Sep 25, 2019

noe132 commented on Sep 26, 2019

rvalimaki commented on Sep 26, 2019

filipesilva commented on Sep 27, 2019

filipesilva commented on Sep 27, 2019

angular-automatic-lock-bot commented on Oct 28, 2019

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions

Command (mark with an `x`)