CODEWITHSUNDEEP
node.jsjsonswagger
Diego
Diego

Reputation: 691

Trying to set up swagger ui inside my node.js / express.js project

I'm trying to set up swagger ui in my node.js / express.js project, this is what i've done

( I'm following the tutorial from this website )

package.json

{
  "name": "challenge",
  "version": "1.0.0",
  "description": "",
  "main": "server.js",
  "type": "module",
  "scripts": {
    "dev": "nodemon server.js",
    "build": "node server.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "cors": "^2.8.5",
    "express": "^4.17.1",
    "nodemon": "^2.0.12",
    "swagger-ui-express": "^4.1.6"
  }
}

swagger.json

{
  "swagger": "2.0",
  "info": {
    "version": "1.0.0",
    "title": "Test Coordinadora - Docs",
    "description": "Competición por cargo desarrollador backend, API en donde se resuelven distintos retos para demostrar capacidad lógica en node.js",
    "license": {
      "name": "MIT",
      "url": "https://opensource.org/licenses/MIT"
    }
  },
  "host": "localhost:5000",
  "basePath": "/challenge",
  "tags": [
    {
      "name": "Test Coordinadora - Docs",
      "description": "Competición por cargo desarrollador backend, API en donde se resuelven distintos retos para demostrar capacidad lógica en node.js"
    }
  ],
  "schemes": ["http"],
  "consumes": ["application/json"],
  "produces": ["application/json"]
}

server.js

import express from "express";
import cors from "cors";
import swaggerUi from "swagger-ui-express";
import swaggerDocument from "./swagger.json";

import routes from "./routes/exercises.js";

const app = express();

app.use(express.json());
app.use(cors()); // Only if we use a fronted to send data

app.use("/challenge", routes);

// Setting up swagger UI

app.use("/api_docs", swaggerUi.serve, swaggerUi.setup(swaggerDocument));

app.listen(5000, () => {
  console.log("Server running succesfully");
});

Folder structure

enter image description here

** When i try npm run dev ** this is the output

internal/process/esm_loader.js:74
    internalBinding('errors').triggerUncaughtException(
                              ^

TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".json" for C:\Users\diego cifuentes\Desktop\Coordinadora Mercantil Examen\challenge\swagger.jsonn\challenge\swagger.json
    at Loader.defaultGetFormat [as _getFormat] (internal/modules/esm/get_format.js:71:15)
    at Loader.getFormat (internal/modules/esm/loader.js:102:42)
    at Loader.getModuleJob (internal/modules/esm/loader.js:231:31)
    at async ModuleWrap.<anonymous> (internal/modules/esm/module_job.js:58:21)
    at async Promise.all (index 3)
    at async link (internal/modules/esm/module_job.js:63:9) {
  code: 'ERR_UNKNOWN_FILE_EXTENSION'
}
[nodemon] app crashed - waiting for file changes before starting...

Any ideas on how to solve this ? I just want to be able to make my API'S docs in route

http://localhost:5000/challenge/docs

Upvotes: 0

Views: 2250

Answers (1)

Mule
Mule

Reputation: 878

Similar solution here, Import '.json' extension in ES6 Node.js throws an error.

You may be running into issues with ES modules. I ran into the same issue. Here is what I did to resolve it.

import fs from 'fs';
import swaggerUi from 'swagger-ui-express';

const swaggerJson = JSON.parse(
  fs.readFileSync(`${path.resolve()}/swagger.json`)
);

const app = express();

app.use('/api-docs/', swaggerUi.serve, swaggerUi.setup(swaggerJson));

Upvotes: 2

Related Questions