从 angular 15 升级到 angular 19 时也升级了 monaco-editor 与 ngx-monaco-editor-v2 ,升级后的 monaco-editor 版本是 0.52.2,ngx-monaco-editor-v2 的版本是 19.0.2
<ngx-monaco-diff-editor [originalModel]="originalModel"
[modifiedModel]="modifiedModel"
(onInit)="onDiffEditorInitialized($event)"
[options]="(options$ | async) ?? defaultOptions"
[insideNg]="false"
class="h-100">
monaco-editor 加载时 load.js 文件不存在,请求的路径是 /assets/loader.js
对应的 options 配置:
readonly defaultOptions: monaco.editor.IDiffEditorOptions = {
codeLens: true,
diffCodeLens: true,
readOnly: true,
} as const;
是 app.config.ts 中通过 provideMonacoEditor 配置的 baseUrl 有误引起的
provideMonacoEditor({
baseUrl: '/assets',
}),
改为正确的路径即可
provideMonacoEditor({
baseUrl: '/assets/monaco/min/vs',
}),
相关源码: