Monaco 使用 InlineCompletionsProvider

AI 代码助手最近太火爆，国内有模型厂商都有代码助手，代码助手是个比较典型的 AI 应用，主要看前端，后端的模型都差不多，国内外都有专门的代码模型。现在都是集中在 VSCode 和 Idea的插件，本文通过 Monaco 实现一个多行代码提示，通过 monaco.languages.registerInlineCompletionsProvider 实现即可，Monaco 的 API 特别丰富，就是文档差点儿。代码中这个 range 没什么用，从 API 来看应该是代码插入代码的区域，但是 end-start 不要出现负值，否则会出问题。在调用的后端的时候，要用节流，请求就太多了，模型受不了。

import logo from './logo.svg';
import './App.css';
import MonacoEditor from 'react-monaco-editor';

import { useRef, useState,useEffect }  from 'react';

function App() {
  const editorRef = useRef(null);
  const monacoRef = useRef(null);
  const decorationsRef = useRef([]);

  const handleEditorDidMount = (editor, monaco) => {
    editorRef.current = editor;
    monacoRef.current = monaco;
    

    monaco.languages.registerInlineCompletionsProvider('javascript', {