执行“ng serve”后,“实时重新加载”看不到添加到assets文件夹的新文件

时间:2018-01-24 16:02:29

标签: angular angular-cli webpack-dev-server

我有:

  1. angular-cli
  2. 控制的angular2应用程序
  3. ng serve用于开发目的,ng build用于生产
  4. 一些微服务生成一些图像并将它们复制到静态文件夹,在当前情况下 - 到./src/assets文件夹
  5. 问题: 文件,在执行ng serve后添加到此文件夹的文件不会被应用程序抛出我的下一个错误:

      

    无法匹配任何路线。网址细分:'assets / test.png'

    执行ng serve之前出现的其他图像成功获取

    重现的步骤:

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

        错误

      Cannot GET
      /assets/error.txt

      1. 尝试修改test.txt echo "file modification is visible by live reload" >> src/assets/test.txt
      2. 获取更新的文件,而无需重新加载服务curl localhost:4200/assets/test.txt
      3. 确认您看到了
      4.   

        此文件可见,因为它在ng服务器文件修改之前位于文件夹中   通过实时重新加载

        1. 使用命令ng g component testcomponent
        2. 创建组件
        3. 使用命令echo "(open tag)app-testcomponent(close tag)(open tag)/app-testcomponent(close tag)" > src/app/app.component.html修改app.component.html(将开放标记更改为<并使用>关闭标记)
        4. 在浏览器中打开localhost:4200并查看testcomponent works!
        5. 从给定的步骤中看到 - 实时重新加载不会仅跟踪资产中的新文件。新添加的组件通常可见而无需重新启动应用程序

          那么,我做错了什么?它不是非常关键(我仍然可以制作生产并使用它)但在应用程序测试期间会产生一些痛苦

          是错误还是我找不到合适的配置告诉应用程序也要注意资产中的收入者?

          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
          

1 个答案:

答案 0 :(得分:-1)

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

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