chenweiqun / Swagger Vue
Licence: mit
Swagger to JS & Vue & Axios Codegen
Stars: ✭ 146
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Swagger Vue
Swagger Axios Codegen
swagger client to use axios and typescript
Stars: ✭ 143 (-2.05%)
Mutual labels: swagger, axios, codegen
Openapi Client Axios
JavaScript client library for consuming OpenAPI-enabled APIs with axios
Stars: ✭ 168 (+15.07%)
Mutual labels: swagger, axios
Openapi Codegen
OpenAPI 3.0 CodeGen plus Node.js minus the Java and emojis
Stars: ✭ 224 (+53.42%)
Mutual labels: swagger, codegen
Swagger Node Codegen
An OpenAPI 3.x/Swagger 2 code generator for Node.js
Stars: ✭ 189 (+29.45%)
Mutual labels: swagger, codegen
Openapi Typescript Codegen
NodeJS library that generates Typescript or Javascript clients based on the OpenAPI specification
Stars: ✭ 249 (+70.55%)
Mutual labels: swagger, codegen
Protein
💊 Protein is an IntelliJ Plugin to generate Kotlin code for Retrofit 2 and RxJava 2 based on a Swagger definition
Stars: ✭ 273 (+86.99%)
Mutual labels: swagger, codegen
Guardrail
Principled code generation from OpenAPI specifications
Stars: ✭ 396 (+171.23%)
Mutual labels: swagger, codegen
Nswag
The Swagger/OpenAPI toolchain for .NET, ASP.NET Core and TypeScript.
Stars: ✭ 4,825 (+3204.79%)
Mutual labels: swagger, codegen
Spring Boot Vuejs
Example project showing how to build a Spring Boot App providing a GUI with Vue.js
Stars: ✭ 1,818 (+1145.21%)
Mutual labels: axios
Gf Cli
GoFrame Command Line Interface, which is your helpmate for building GoFrame application with convenience.
Stars: ✭ 143 (-2.05%)
Mutual labels: swagger
Snapshot
SnapShot is Gallery created using React Hooks, Context API and React Router. The Routes were setup for four default pages and a search page. Also the images were displayed using the Flickr API and Axios to fetch data.
Stars: ✭ 134 (-8.22%)
Mutual labels: axios
Swaggerassertions
Assert your API requests and responses match with your swagger definition
Stars: ✭ 137 (-6.16%)
Mutual labels: swagger
Tropical Fish
Pragmatic 风格的 Java EE 后端开发脚手架,开箱即用。基于 SpringBoot,技术选型采用主流的框架(Mybatis-Plus,Redisson,Xxl-job,Swagger)。项目特点:自定义查询语法, 可以自由组装查询条件查询数据,配合代码生成模块,提高研发效率;自定义 service 方法级别的文档生成规则,在业务方法增加必要的注解,可生成方法调用树,快速把握复杂代码业务逻辑。
Stars: ✭ 142 (-2.74%)
Mutual labels: swagger
Swagger to uml
Convert OpenAPI specifications (a.k.a. Swagger) to PlantUML diagrams
Stars: ✭ 144 (-1.37%)
Mutual labels: swagger
Vue Element Quick Start
Vue2, Vuex 3, Vue Router 3, Element-ui and Typescript SPA project quick start kit(Vue element ui 快速开始脚手架)
Stars: ✭ 135 (-7.53%)
Mutual labels: axios
Swagger Ui Watcher
Automatically refreshes Swagger UI on Swagger file changes
Stars: ✭ 135 (-7.53%)
Mutual labels: swagger
Vue Cli Multi Page
基于vue-cli模板的多页面多路由项目,一个PC端页面入口,一个移动端页面入口,且有各自的路由, vue+webpack+vue-router+vuex+mock+axios
Stars: ✭ 145 (-0.68%)
Mutual labels: axios
Gatsby Plugin Typegen
High-performance TypeScript/Flow code generation for GatsbyJS queries.
Stars: ✭ 144 (-1.37%)
Mutual labels: codegen
swagger-vue
Swagger to JS & Vue & Axios Codegen
Installation
npm install swagger-vue --dev
Generate
Using NodeJS file
const swaggerGen = require('swagger-vue')
const jsonData = require('../api-docs.json')
const fs = require('fs')
const path = require('path')
let opt = {
swagger: jsonData,
moduleName: 'api',
className: 'api'
}
const codeResult = swaggerGen(opt)
fs.writeFileSync(path.join(__dirname, '../dist/api.js'), codeResult)
Using Grunt task
Create Gruntfile.js
const fs = require('fs')
const path = require('path')
const swaggerGen = require('swagger-vue')
module.exports = function(grunt) {
grunt.initConfig({
'pkg': grunt.file.readJSON('package.json'),
'swagger-vue-codegen': {
options: {
swagger: "<%= pkg.swagger.definition %>",
className: "<%= pkg.swagger.className %>",
moduleName: "vue-<%= pkg.swagger.moduleName %>",
dest: 'client/javascript'
},
dist: {
}
}
});
grunt.registerMultiTask('swagger-vue-codegen', function() {
var callback = this.async();
var opt = this.options();
var distFileName = path.join(opt.dest, opt.moduleName + '.js');
fs.readFile(opt.swagger, function(err, data) {
if (err) {
grunt.log.error(err.toString());
callback(false);
} else {
var parsedData = JSON.parse(data);
var codeResult = swaggerGen({
swagger: parsedData,
moduleName: opt.moduleName,
className: opt.className
});
fs.writeFile(distFileName, codeResult, function(err) {
if (err) {
grunt.log.error(err.toString());
callback(false);
} else {
grunt.log.writeln('Generated ' + distFileName + ' from ' + opt.swagger);
}
})
}
});
});
grunt.registerTask('vue', ['swagger-vue-codegen']);
};
And set options in package.json
...
"swagger": {
"definition": "client/swagger.json",
"className": "API",
"moduleName": "api-client"
}
...
Now you can use grunt vue
to run build task
Generated client usage
In Vue.js main file set API domain
import { setDomain } from './lib/api-client.js'
setDomain('http://localhost:3000/api')
Import API function into Vue.js component, for example to log in
import { user_login as userLogin } from '../lib/api-client.js'
userLogin({
credentials: {
username: 'admin',
password: 'admin'
}
}).then(function (response) {
console.log(response.data) // {id: "<token>", ttl: 1209600, created: "2017-01-01T00:00:00.000Z", userId: 1}
})
All requests use axios module with promise, for more information about that follow axios documentation
Links
License
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].