4

i have:

  1. angular2 application controlled by angular-cli
  2. ng serve for dev purposes and ng build for production
  3. some microservice which generates some images and copy them to static folder, in current situation - to ./src/assets folder

problem: files, that were added to this folder after ng serve was executed are not visible by application throwing me next error:

Cannot match any routes. URL Segment: 'assets/test.png'

while other images that were present before ng serve was executed are successfully fetching

steps to reproduce:

  1. init mock angular application with command ng new my-app
  2. go to generated folder with command cd my-app/
  3. create some test file in assets folder with command echo "this file is visible because it was in folder before ng serve" >> src/assets/test.txt
  4. launch app with command ng serve
  5. in another terminal window, check that recently created file is visible by url with command curl localhost:4200/assets/test.txt
  6. verify that curl returned this file is visible because it was in folder before ng serve
  7. add one more file without reloading ng serve with command echo "don't matter because you'll get an error" >> src/assets/error.txt
  8. try to get that file with command curl localhost:4200/assets/error.txt
  9. verify that you see error

Error 

Cannot GET
/assets/error.txt
  1. try to modify test.txt echo "file modification is visible by live reload" >> src/assets/test.txt
  2. get updated file without reloading ng serve curl localhost:4200/assets/test.txt
  3. verify that you see

this file is visible because it was in folder before ng serve file modification is visible by live reload

  1. create component with command ng g component testcomponent
  2. modify app.component.html with command echo "(open tag)app-testcomponent(close tag)(open tag)/app-testcomponent(close tag)" > src/app/app.component.html (change open tag with < and close tag with >)
  3. open localhost:4200 in browser and see testcomponent works!

as you see from given steps - live reload do not track only new files in assets. newly added component is normally visible without restarting app

so, what i'm doing wrong? it's not very critical (i still can make production build and work with it) but makes some pain during app testing

is it bug or i can't find proper configuration to tell app to watch for incomers in assets also?

ng --version gives me next output

Angular CLI: 1.6.5
Node: 9.4.0
OS: darwin x64
Angular: 5.2.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.5
@angular-devkit/build-optimizer: 0.0.41
@angular-devkit/core: 0.0.28
@angular-devkit/schematics: 0.0.51
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.5
@schematics/angular: 0.1.16
typescript: 2.5.3
webpack: 3.10.0
Xenobyte
  • 173
  • 10

1 Answers1

-1

You can try create some kind of registry file in assets folder. Changes applied to this file will be visible and ng serve will reload project. Algorithm:

  • Before ng serve create file in assets folder (for example "List_of_added_files.txt)
  • Start ng serve. When your microservice adds file, run some script to change message into List_of_added_files, example: filename. Angular should see changes and rebuild project.
OctaGreen
  • 1
  • 1