feat(openapi): support openapi plugins (#527)

* feat(openapi): support openapi plugins

* fix bug

* support joi

* use openAPI

* add more options

* support doc

* fix path

* remoe unuse

* remove unuse code

* use default style

* support windows

Author: chenshuai2144

packages/plugin-layout/src/layout/index.tsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
 // @ts-ignore
-import { Link, useModel, history, formatMessage } from 'umi';
+import { Link, useModel, history } from 'umi';
 import ProLayout, { BasicLayoutProps } from '@ant-design/pro-layout';
 import './style.less';
 import renderRightContent from './renderRightContent';

packages/plugin-openapi/README.md

@@ -0,0 +1,19 @@
+# @umijs/plugin-openapi
+
+> @umijs/plugin-openapi.
+
+See our website [@umijs/plugin-openapi](https://umijs.org/plugins/plugin-openapi) for more information.
+
+## Install
+
+Using npm:
+
+```bash
+$ npm install --save-dev @umijs/plugin-openapi
+```
+
+or using yarn:
+
+```bash
+$ yarn add @umijs/plugin-openapi --dev
+```

packages/plugin-openapi/package.json

@@ -0,0 +1,35 @@
+{
+  "name": "@umijs/plugin-openapi",
+  "version": "1.0.4",
+  "description": "@umijs/plugin-openapi",
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "files": [
+    "lib",
+    "src"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/umijs/plugins"
+  },
+  "keywords": [
+    "umi"
+  ],
+  "authors": [
+    "chencheng <sorrycc@gmail.com> (https://github.com/sorrycc)"
+  ],
+  "license": "MIT",
+  "bugs": "http://github.com/umijs/plugins/issues",
+  "homepage": "https://github.com/umijs/plugins/tree/master/packages/plugin-openapi#readme",
+  "peerDependencies": {
+    "umi": "3.x"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@umijs/openapi": "^1.1.6",
+    "serve-static": "^1.14.1",
+    "swagger-ui-react": "^3.41.1"
+  }
+}

packages/plugin-openapi/src/index.ts

@@ -0,0 +1,113 @@
+import { join } from 'path';
+import { IApi } from 'umi';
+import rimraf from 'rimraf';
+import serveStatic from 'serve-static';
+import { generateService, getSchema } from '@umijs/openapi';
+import { existsSync, mkdirSync, writeFileSync } from 'fs';
+
+export default (api: IApi) => {
+  api.describe({
+    key: 'openAPI',
+    config: {
+      schema(joi) {
+        return joi.object({
+          requestLibPath: joi.string(),
+          schemaPath: joi.string(),
+          mock: joi.boolean(),
+          projectName: joi.string(),
+        });
+      },
+    },
+    enableBy: api.EnableBy.config,
+  });
+  const { absNodeModulesPath, absTmpPath } = api.paths;
+  const openAPIFilesPath = join(absNodeModulesPath!, 'umi_open_api');
+
+  try {
+    if (existsSync(openAPIFilesPath)) {
+      rimraf.sync(openAPIFilesPath);
+    }
+    mkdirSync(join(openAPIFilesPath));
+  } catch (error) {
+    // console.log(error);
+  }
+
+  // 增加中间件
+  api.addMiddewares(() => {
+    return serveStatic(openAPIFilesPath);
+  });
+
+  api.onGenerateFiles(() => {
+    api.writeTmpFile({
+      path: join('plugin-openapi', 'openapi.tsx'),
+      content: `
+import SwaggerUI from "swagger-ui-react";
+import "swagger-ui-react/swagger-ui.css";
+
+const App = () => (
+  <div
+    style={{
+      padding: 24,
+    }}
+  >
+    <SwaggerUI url="/umi-plugins_openapi.json" />
+  </div>
+);
+export default App;
+`,
+    });
+  });
+
+  if (api.env === 'development') {
+    api.modifyRoutes((routes) => {
+      return [
+        {
+          path: '/umi/plugin/openapi',
+          component: api.utils.winPath(
+            join(absTmpPath!, 'plugin-openapi', 'openapi.tsx'),
+          ),
+        },
+        ...routes,
+      ];
+    });
+  }
+
+  api.onDevCompileDone(async () => {
+    try {
+      const openAPIConfig = api.config.openAPI;
+      const openAPIJson = await getSchema(openAPIConfig.schemaPath);
+      writeFileSync(
+        join(openAPIFilesPath, 'umi-plugins_openapi.json'),
+        JSON.stringify(openAPIJson, null, 2),
+      );
+    } catch (error) {
+      console.error(error);
+    }
+  });
+
+  api.registerCommand({
+    name: 'openapi',
+    fn: async () => {
+      const openAPIConfig = api.config.openAPI;
+      const pageConfig = require(join(api.cwd, 'package.json'));
+      const mockFolder = openAPIConfig.mock ? join(api.cwd, 'mock') : undefined;
+      const serversFolder = join(api.cwd, 'src', 'services');
+      // 如果mock 文件不存在，创建一下
+      if (mockFolder && !existsSync(mockFolder)) {
+        mkdirSync(mockFolder);
+      }
+      // 如果mock 文件不存在，创建一下
+      if (serversFolder && !existsSync(serversFolder)) {
+        mkdirSync(serversFolder);
+      }
+
+      await generateService({
+        projectName: pageConfig.name.split('/').pop(),
+        ...openAPIConfig,
+        serversPath: serversFolder,
+        mockFolder,
+      });
+      api.logger.info('[openAPI]: execution complete');
+    },
+  });
+};