How to use JS code compiler Monaco

import * as monaco from 'monaco-editor' // The package is big but the demo can run // Customize some suggestion functions const suggestions = [
  {
    label: 'split_chinese',
    insertText: 'split_chinese(inputString,language);', // Not displayed when not written. .
    Details:
      'inputString: need split string\n' +
      'language:\nCH_T：traditional Chinese\nCH_S：Chinese Simplified\n HK_T:Hong Kong Traditional\nTW_T:Taiwan Traditional\n'
  },
  {
    label: 'uuid',
    insertText: 'var uuid = uuid();',
    detail: 'generate uuid'
  },
  {
    label: 'HashMap',
    insertText: 'var hashMap = new HashMap();',
    detail: 'create hash object'
  }
]

mounted() {
    monaco.languages.registerCompletionItemProvider('JavaScript', {
      provideCompletionItems() {
        return {
          suggestions: suggestions
        }
      },
      triggerCharacters: [' ', '.'] // Write the characters that trigger the prompt, there can be multiple })
    let self = this
    setTimeout(function () {
      self.init()
    }, 50) //Because the parent component has not passed the parameter, the child component has been rendered}
  
 // Initialization method init(script) {
  let self = this
  if (script) this.code = script
  self.$refs.container.innerHTML = ''
  var editor = monaco.editor.create(this.$refs.container, {
    value: this.code,
    language: 'javascript',
    minimap:
      enabled: false
    },
    fontSize: '12px',
    fixedOverflowWidgets: true // Use fixed attributes to display widgets that exceed the editor size})
  editor.onDidChangeModelContent(function () {
    self.$emit('update:code', editor.getValue()) //Used to monitor editor content changes and pass the content to the parent component})
}

<template>
  <div ref="container" class="monaco"></div>
</template>

<style scoped>
.monaco {
  width: 95%;
  height: 400px;
  border: 1px solid #dcdfe6;
  text-align: left;
  margin-right: 20px;
  border-radius: 4px;
}
</style>