How to use @vue/compiler-dom - 2 common examples

function compileCode(source: string): string {
    console.clear()
    try {
      const errors: CompilerError[] = []
      const { code, ast, map } = compile(source, {
        filename: 'template.vue',
        ...compilerOptions,
        sourceMap: true,
        onError: err => {
          errors.push(err)
        }
      })
      monaco.editor.setModelMarkers(
        editor.getModel()!,
        `@vue/compiler-dom`,
        errors.filter(e => e.loc).map(formatError)
      )
      console.log(`AST: `, ast)
      lastSuccessfulCode = code + `\n\n// Check the console for the AST`
      lastSuccessfulMap = new window._deps['source-map'].SourceMapConsumer(map)
      lastSuccessfulMap!.computeColumnSpans()

const key = template
  const cached = compileCache[key]
  if (cached) {
    return cached
  }

  if (template[0] === '#') {
    const el = document.querySelector(template)
    if (__DEV__ && !el) {
      warn(`Template element not found or is empty: ${template}`)
    }
    template = el ? el.innerHTML : ``
  }

  const { code } = compile(template, {
    hoistStatic: true,
    onError(err: CompilerError) {
      if (__DEV__) {
        const message = `Template compilation error: ${err.message}`
        const codeFrame =
          err.loc &&
          generateCodeFrame(
            template as string,
            err.loc.start.offset,
            err.loc.end.offset
          )
        warn(codeFrame ? `${message}\n${codeFrame}` : message)
      }
    },
    ...options
  })