angular - "live reload"看不到执行 "ng serve"后添加到 Assets 文件夹的新文件

Question

我有:

1. 由 angular-cli 控制的 angular2 应用程序
2. ng serve 用于开发目的，ng build 用于生产
3. 生成一些图像并将它们复制到静态文件夹的一些微服务，在当前情况下 - 复制到 ./src/assets 文件夹

问题:执行 ng serve 后添加到此文件夹的文件对应用程序不可见并抛出下一个错误:

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

在执行 ng serve 之前存在的其他图像正在成功获取

重现步骤:

1. 使用命令 ng new my-app 初始化模拟 Angular 应用程序
2. 使用命令 cd my-app/ 转到生成的文件夹
3. 使用命令在 assets 文件夹中创建一些测试文件 echo "this file is visible because it was in folder before ng serve">> src/assets/test.txt
4. 使用命令 ng serve 启动应用程序
5. 在另一个终端窗口中，使用命令 curl localhost:4200/assets/test.txt
检查最近创建的文件是否可见
6. 验证 curl 返回的此文件可见，因为它在 ng serve 之前位于文件夹中
7. 再添加一个文件而不使用命令echo "don't matter because you'll get an error">> src/assets/重新加载ng serve错误.txt
8. 尝试使用命令获取该文件 curl localhost:4200/assets/error.txt
9. 验证您是否看到错误

Error

Cannot GET/assets/error.txt

1. 尝试修改test.txt echo "file modification is visible by live reload">> src/assets/test.txt
2. 获取更新文件而不重新加载 ng serve curl localhost:4200/assets/test.txt
3. 验证你看到了

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

1. 使用命令 ng g component testcomponent 创建组件
2. 使用命令修改 app.component.html echo "(open tag)app-testcomponent(close tag)(open tag)/app-testcomponent(close tag)"> src/app/app.component.html (用 < 改变开始标签，用 > 结束标签)
3. 在浏览器中打开 localhost:4200 并查看 testcomponent works!

正如您从给定步骤中看到的那样 - 实时重新加载不会仅跟踪 Assets 中的新文件。新添加的组件正常可见，无需重启应用

所以，我做错了什么？它不是很关键(我仍然可以进行生产构建并使用它)但在应用程序测试期间会带来一些痛苦

是错误还是我找不到合适的配置来告诉应用程序也监视 Assets 中的收入者？

ng --version 给我下一个输出

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

Answer 1

您可以尝试在 Assets 文件夹中创建某种注册表文件。应用于此文件的更改将可见，并且 ng serve 将重新加载项目。算法:

• 在 ng 服务之前在 Assets 文件夹中创建文件(例如“List_of_added_files.txt”)
• 开始服务。当您的微服务添加文件时，运行一些脚本将消息更改为 List_of_added_files，例如:文件名。 Angular 应该看到变化并重建项目。