類型的結構自動完成

Question

我們正在努力將Monaco與我們基於Web的RAD產品集成在一起，使用React構建。它有一個創建狀態（一個簡單的JSON結構）和事件處理程序編輯器的用戶界面，用戶可以編寫函數來處理像onClick等組件事件。我們使用Monaco作爲事件處理程序部分。一個典型的事件處理程序看起來像這樣（簡體） -

function onClick($state){ 
    // do something with $state 
} 

注意$state結構是基於其用戶創建的國家的形狀。

既然代碼託管在摩納哥，我們希望讓用戶看到$ state變量的自動完成。通過在摩納哥遊樂場中使用這個用例，我們是否需要在$ state結構周圍創建一個動態d.ts才能使用？還是有更簡單的替代方法，我們將狀態結構注入編輯器DOM並讓它自動完成？

Answer 1

使用monaco.languages.typescript.typescriptDefaults.addExtraLib

$.get('../State.d.ts').done(function (data) { 
     console.info('done'); 


     require.config({ paths: { 'vs': '../node_modules/monaco-editor/min/vs' } }); 

     require(['vs/editor/editor.main'], function() { 
      monaco.languages.typescript.typescriptDefaults.addExtraLib(data, 'StateObject'); 
      editor = monaco.editor.create(document.getElementById('container'), { 
       value: ['aso.EnvironmentName = "DEV"' 
       ].join('\n'), 
       language: 'typescript' 
      }); 
     }); 
    }) 

State.d.ts（你也可以提供JSON）：

interface StateObject { 
    CapitalCity: string, 
    Population: number, 
    ZipCodes: string[] 
} 

，你將智能感知的Git爲目的。

將addExtraLib想象成using/include/require語句。