redux-toolkit
redux-toolkit copied to clipboard
Codegen - No esbuild-runner or ts-node
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;
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? :)
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?
Ah, I didn't know that part. I will probably have to mark them as optional peer dependencies then.
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
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
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.
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],
},
}
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.
We were able to make it run correctly with these steps
-
Install ts-node
yarn add ts-node --dev
-
Add a new script on package.json
"api-generate": " npx @rtk-query/codegen-openapi openapi-config.ts"
- 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
- Generate code
yarn api-generate
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.
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:
- npm i @rtk-query/codegen-openapi (^1.0.0-alpha.1)
- ./node_modules/.bin/rtk-query-codegen-openapi apps/impaqt-plus-ui/config/openapi.config.ts (disclaimer, I'm in a nx dev monorepo, so my command is npx nx run ...comand)
- I get the Error: Cannot find module 'ajv/dist/core'
- the only help I found was https://bytemeta.vip/repo/seriousme/fastify-openapi-glue/issues/264
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:
- @rtk-query/codegen-openapi (^1.0.0-alpha.1) has dependency of "@apidevtools/swagger-parser": "^10.0.2"
- @apidevtools/swagger-parser": "^10.0.2 has a dependency to ajv
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/[email protected] and then install @rtk-query/codegen-openapi so version is locked
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 🙂
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 🫡 🚀🚀🚀
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
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