reduxjs / redux-toolkit

The official, opinionated, batteries-included toolset for efficient Redux development
https://redux-toolkit.js.org
MIT License
10.59k stars 1.14k forks source link

Codegen - No esbuild-runner or ts-node #1775

Open grumpyTofu opened 2 years ago

grumpyTofu commented 2 years ago

I just tried the new 1.0.0-alpha.1 version and noticed that I can't get the example working.

$ npx @rtk-query/codegen-openapi openapi.dev.config.ts
npx: installed 64 in 7.95s
Encountered a TypeScript configfile, but neither esbuild-runner nor ts-node are installed.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

I am wondering if it has to do with the esbuild-runner and ts-node listed as dev dependencies so npx is not installing them when running in production?

The only way I have been able to get it to work so far is to call the cli directly:

node ./node_modules/@rtk-query/codegen-openapi/lib/bin/cli.js openapi.dev.config.ts

config file:

import { ConfigFile, generateEndpoints } from "@rtk-query/codegen-openapi";

const {
  parsed: { OPENAPI_DOCS },
} = require("dotenv").config({ path: "./.env.local" });

const config: ConfigFile = {
  schemaFile: OPENAPI_DOCS,
  apiFile: "./src/app/example-api.empty.ts",
  apiImport: "emptyApi",
  outputFile: "./src/app/example-api.generated.ts",
  exportName: "api",
  hooks: true,
};

export default config;
phryneas commented 2 years ago

I do really not want to force the installation of development tools like esbuild-runner or ts-node into your project (especially as esbuild-runner needs esbuild binaries installed - although it is the faster choice by a lot). And listing them as dependency would add them into your project as soon as you added the codegen to your project.

If you have installed one of them installed in your project, you can use TS config files. Otherwise you can't (.js and .json still work fine). I had hoped the error message made that clear.

Do you have any rewording suggestions there? :)

grumpyTofu commented 2 years ago

That makes sense to give the user freedom to choose and the wording seems clear enough to me. However, the issue is that I do have both installed. Here is my dev dependencies:

"devDependencies": {
    "@rtk-incubator/rtk-query-codegen-openapi": "^0.5.0",
    "@rtk-query/codegen-openapi": "^1.0.0-alpha.1",
    "@types/react-router-dom": "^5.3.2",
    "dotenv": "^10.0.0",
    "esbuild": "^0.14.0",
    "esbuild-runner": "^2.2.1",
    "openapi-typescript-codegen": "^0.12.3",
    "ts-node": "^10.3.0"
  }

This is where the confusing bit came into play ;) codegen is telling me to install what I already installed. Does it matter that I have made everything dev dependencies?

phryneas commented 2 years ago

Ah, I didn't know that part. I will probably have to mark them as optional peer dependencies then.

floatrx commented 2 years ago

Typescript: openapi-config.ts

import { ConfigFile } from '@rtk-query/codegen-openapi';

const config: ConfigFile = {
  schemaFile: './openapi-spec.json',
  apiFile: './src/store/baseApi.ts',
  apiImport: 'baseApi',
  outputFile: './src/store/coreApi.ts',
  exportName: 'coreApi',
  hooks: true,
};

export default config;
 $ npx @rtk-query/codegen-openapi openapi-config.ts
npx: installed 64 in 13.316s
Encountered a TypeScript configfile, but neither esbuild-runner nor ts-node are installed.

but

{
  "schemaFile": "./openapi-spec.json",
  "apiFile": "./src/store/baseApi.ts",
  "apiImport": "baseApi",
  "outputFile": "./src/store/coreApi.ts",
  "exportName": "coreApi",
  "hooks": true
}
npx @rtk-query/codegen-openapi openapi-config.json
npx: installed 64 in 4.483s
Generating ./src/store/coreApi.ts
Done

upd;

npx @rtk-incubator/rtk-query-codegen-openapi openapi-config.ts

package.json

{
  "devDependencies": {
    "@craco/craco": "^6.4.3",
    "@rtk-incubator/rtk-query-codegen-openapi": "^0.5.1",
    "@rtk-query/codegen-openapi": "^1.0.0-alpha.1",
    "craco-alias": "^3.0.1",
    "craco-antd": "^1.19.0",
    "craco-sass-resources-loader": "^1.1.0",
    "typescript": "^4.5.2"
  }
}

works too

timhughes commented 2 years ago

the tests are still using @rtk-incubator/rtk-query-codegen-openapi in the config

https://github.com/reduxjs/redux-toolkit/blob/edc3d088ca76e9ec568626eae70726bad9a2e5bc/packages/rtk-query-codegen-openapi/test/config.example.ts#L1

sshquack commented 2 years ago

Thanks @floatrx Ran into the same issue and converting to json did the trick!

It looks like the rtk-incubator npm package is still getting over 1k weekly downloads.

Currently following the OpenAPI generation docs throws this error. It would be nice to add a note in the docs to help beginners.

bahtiyarerden commented 2 years ago

Hi, I tried to install ts-node and esbuild-runner (individually or both) packages as both dependencies and devDependencies but no luck.

npx @rtk-query/codegen-openapi openapi-config.ts
npx: installed 64 in 17.995s
Encountered a TypeScript configfile, but neither esbuild-runner nor ts-node are installed.

I tried to use .json version but I could not find how to define regex for filterEndpoints. For example

    outputFiles: {
        './src/Services/modules/card/card.ts': {
            filterEndpoints: [/card/i],
        },
    }
phryneas commented 2 years ago

Worst case you should always be able to use .js. Generally, it seems that you have to install both @rtk-query/codegen-openapi and one of those two packages - and then not run it through npx but out of a npm script.

jonra1993 commented 2 years ago

We were able to make it run correctly with these steps

  1. Install ts-node yarn add ts-node --dev

  2. Add a new script on package.json

"api-generate": " npx @rtk-query/codegen-openapi openapi-config.ts"

  1. Create emptyApi.ts and openapi-config.ts file as sample documentation recommend https://redux-toolkit.js.org/rtk-query/usage/code-generation#openapi
import type { ConfigFile } from '@rtk-query/codegen-openapi'
const config: ConfigFile = {
  schemaFile: 'https://petstore3.swagger.io/api/v3/openapi.json',
  apiFile: './src/services/empty-api.ts',
  apiImport: 'emptySplitApi',
  outputFiles: {
    './src/services/user.ts': {
      filterEndpoints: [/user/i],
    },
    './src/services/order.ts': {
      filterEndpoints: [/order/i],
    },
    './src/services/pet.ts': {
      filterEndpoints: [/pet/i],
    },
  },
  hooks: true,
}
export default config
  1. Generate code yarn api-generate
thebetternewt commented 2 years ago

Can also use JS types in a .js file:

/** @type {import("@rtk-query/codegen-openapi").ConfigFile} */
const config = {
  schemaFile: './schemas/core.json',
  apiFile: './src/api/apiSlice.ts',
  apiImport: 'apiSlice',
  outputFile: './src/api/gen/core.ts',
  exportName: 'coreApi',
  hooks: true,
  endpointOverrides: [{ pattern: /Query$/, type: 'query' }],
};

module.exports = config;

This gives you type checking without the need for TypeScript.

asherccohen commented 2 years ago

Hi all, I'll drop this here as I also encountered another issue.

The above solutions didn't work for me so I instead tapped into the .bin folder and ran codegen manually but another package is missing.

My steps:

So probably bumping ajv and changing the import should work. I haven't found a workaround yet.

EDIT: Ok after a bit of reserahc into the installed packages I have noted that:

I have another project (CRA based, not in a monorepo) and there the installed version of "@apidevtools/swagger-parser": is "^10.0.3" which doesn't use ajv. So Unless I got something wrong, updating @apidevtools/swagger-parser should fix the issue.

My solution was to install @apidevtools/swagger-parser@10.0.3 and then install @rtk-query/codegen-openapi so version is locked

mahmudipur commented 11 months ago

I installed ts-node as a devDependency beside @rtk-query/codegen-openapi and it worked correctly, but the result was a real mess. all changes reverted 🙂

amorfc commented 10 months ago

Hello everyone, if anyone still having trouble with this error Encountered a TypeScript configfile, but neither esbuild-runner nor ts-node are installed.

I just installed esbuild-runner as dev dependency. Command 👉 npm install --save-dev esbuild-runner

I am using open-api config file which is .ts file as official documentation declaration.

Now everything is smooth 🫡 🚀🚀🚀

maxim1006 commented 3 months ago

If someone still struggles in 2024 with this issue, you have to change your nodejs version or use this package without npx like this:

"open-api-codegen": "./node_modules/.bin/rtk-query-codegen-openapi src/codegen/openapi-config.ts"

Thanks

ayothealoko commented 3 months ago

To add to what @maxim1006 is saying the command for npx and in package.json is 'rtk-query-codegen-openapi'

package.json "open-api-codegen": "rtk-query-codegen-openapi"

bash

npx rtk-query-codegen-openapi config.ts