前端yaml/json转换为swagger文档

1、安装swagger依赖
yarn add swagger-ui-dist
or
npm install swagger-ui-dist --save

html部分

<div id="swagger-ui"></div>

js部分
注意这部分代码涉及到渲染dom节点，需要在dom渲染完成之后执行，如果是vue，把这段代码放到mounted里面或者使用this.$nextTick

import { SwaggerUIBundle, SwaggerUIStandalonePreset } from "swagger-ui-dist"
import 'swagger-ui-dist/swagger-ui.css'

let url = data

// 获取到的为字符串时，转换为本地url
// 可以直接拿到url使用时不用下面两步
let blob = new Blob([url])
url = URL.createObjectURL(blob)

this.getSwagger(url)

getSwagger (url) {
  // SwaggerUI()
  const ui = SwaggerUIBundle({
    url,
    dom_id: '#swagger-ui',
    presets: [
      SwaggerUIBundle.presets.apis,
      SwaggerUIStandalonePreset
    ],
    layout: "StandaloneLayout"
  })
},

这次的需求是第三方给了一个yaml，需要转成swagger格式，这种方式转出来的swagger其实在大多数情况下只能看看长啥样，跨域是基本无法解决的问题，如果文档中的域名与服务器域名一致的话还好，如果域名不一致且可以任意编辑，暂时想不到更好的解决方式。希望有大神能够想出一个更好的解决方案