小编liv*_*mas的帖子

我有一个相当大的 Vue 3 应用程序（约 550 个组件）。运行需要两分钟vue-cli-service serve，每次更改后重新构建需要大约 20 秒。热重载很久以前就停止工作了，因此即使在很小的样式更改之后，它也始终需要在浏览器中刷新。此外，该应用程序还没有完成，明年它可能会变得如此大 2-3 倍，所以它可能会更糟。

由于这些问题，我决定将其从 Vue CLI 迁移到 Vite。我已经解决了很多问题，并且该应用程序现在似乎可以与 Vite 配合使用，加载时间要短得多。

但是，当我启动开发服务器（vite命令）并在浏览器中打开它时，它有时会卡住。页面不断加载，我可以在 Chrome DevTools 的“网络”选项卡中看到很多待处理的请求。的输出没有什么特别的vite --debug，运行vite --force也没有帮助。

出现此问题时，浏览器总是加载很多模块（~900），然后卡在 10-20 个模块上。所有这些 HTTP 请求的状态都很简单Pending，而且永远不会完成。浏览器或命令行中没有错误。

我不认为任何特定文件会导致此问题。也许问题出在我的深层嵌套文件夹结构中，每个级别上都有大量使用index.ts文件的重新导出。它主要卡在我自己的模块上，但我也看到过它等待某些外部库的模块的情况。

有人遇到过类似的问题吗？你是怎么解决的？

编辑：我发现此问题仅发生在 Linux 上基于 Chromium 的浏览器（Google Chrome、Brave 等）中。它在 MacOS 和 Windows 上的 Chrome 以及 Linux 上的其他浏览器（Firefox、GNOME Web 等）中运行没有任何问题。

我的 Angular 5 应用程序基于NgRx，这是一个类似于 Redux 但基于 RxJS 的状态管理库。

我经常需要根据当前操作的有效负载从存储中获取最新值。

在 RxJS 术语中，这意味着我有我的主流，它不断产生项目，对于每个新项目，我需要根据项目的值创建一个侧流，从该流中获取最新值，并将其与主流结合。

目前，我做这样的事情：

@Effect()
public moveCursor$: Observable<Action> = this.actions$.pipe(
  ofType<TableAction.MoveCursor>(TableActionType.MOVE_CURSOR),
  switchMap(action => this.store$.select(selectTableById(action.payload.cursor.tableId)).pipe(
    first(),
    map(table => ({action, table}))
  )),
  map(({action, table}) => {
    ...
  })
)

我知道这可能不是最好的解决方案，我正在寻找这样的东西（withLatestFrom运营商不可能）：

@Effect()
public moveCursor$: Observable<Action> = this.actions$.pipe(
  ofType<TableAction.MoveCursor>(TableActionType.MOVE_CURSOR),
  withLatestFrom(action => this.store$.select(selectTableById(action.payload.cursor.tableId))),
  map(([action, table]) => {
    ...
  })
)

所以我的问题是：是否有任何类似于withLatestFrom可以将第一个流产生的值作为参数的RxJS 运算符？

我的Web应用程序基于Angular，我尝试使用ngx-quill库将Quill集成到其中。我创建了仅包含不可修改的文本块（从数据库中检索到）的自定义嵌入污点，现在我尝试创建一个自定义工具栏，允许用户将该污点实例插入文本。

我的问题是，如何在Quill工具栏中创建自定义下拉菜单，在其中我可以提供自己的内容，这些内容将显示给用户并插入到文本中？

我尝试这样做：

<quill-editor>
  <div quill-editor-toolbar>
    <select class="ql-attribute">
      <option *ngFor="let attribute of documentAttributes()"
              [title]="document.data[attribute.id]"
              (click)="onAddAttribute(attribute.id)">
        {{attribute.name}}
      </option>
    </select>
  </div>
</quill-editor>

...但是下拉菜单中没有显示任何值。

看来这个问题已经为React和Plain JS解决了。但看起来这将是一个有点困难的角度这样做，尤其是当奎尔使用集成QuillEditorComponent提供通过NGX-鹅毛笔库。