restful Api 风格契约设计器：Swagger-editor和swagger-ui的应用

swagger-editor的安装

• swagger-editor应用的yaml语法，有定义变量和数据结构，不明白能够参考其示例
• 安装步骤：
  • 下载swagger-editor git地址
  • 运行npm run build生成可运行的包

    • window注意事项：

    • 去掉package.json文件中scripts节点的prebuild功能，否则会提示 rm -rf dist/** 无效，看出这是删除生成包的文件，能够手动删除或者本身改下命令。

    • 更改.eslintrc.js文件，主要是修正linebreak-style的验证方式

      module.exports = {
        extends: 'google',
        quotes: [2, 'single'],
        globals: {
          SwaggerEditor: false
        },
        env: {
          browser: true
        },
        rules:{
          "linebreak-style": ["error", "windows"]
        }
      };

• 增长了rules节点，以上是.eslintrc.js完整的配置

• 输入 .\node_modules\.bin\http-server便可打开，而后访问此服务器的8080端口就能够了。

swagger-ui的安装

• 展现swagger-editor生成的api文档，api文档格式能够是yaml或json。
• 安装步骤：
  • 下载swagger-ui git地址
  • 两种部署方式：
    • 第一种：能够直接把dist文件夹中内容复制到某个网站目录下或者建立一个新的站点也能够，这里有一套默认的swagger-ui的默认皮肤。
    • 第二种：
      • 运行cnpm install 安装全部依赖包
      • 运行gulp serve
      • 访问本机的8080端口，若是存在多个http-server，须要自定义http-server的端口，在gulpfile.js文件中实现

gulp.task('connect', function() {
  connect.server({
    root: 'dist',
    livereload: true,
    port:8888
  });
});

• 能够增长打印功能，用于导出api文档为pdf格式的。方便传阅。