Skip to content

feat(nx-plugin): add NX Plugin with OpenAPI client generator and executor #1947

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 17 commits into
base: main
Choose a base branch
from

Conversation

seriouslag
Copy link
Contributor

@seriouslag seriouslag commented Apr 14, 2025

This NX plugin will generate an NX package from an OpenAPI spec file and run the openapi-ts on the spec.

This is useful for NX projects.
Also very useful to let AI agents know how to use the plugin to automate setting up client code to fit into an NX project.

TODO:

  • Add NX generator to generate library code and generate client code based off an openapi spec file
  • Add NX executor to check the provided spec file for changes and update client code
  • Accept openapi spec input, dereference, and bundle the spec file using functions from openapi-ts
  • Setup tests using vitest
  • Add an executor to update the API spec file and regenerate the client code
  • Get build working (facing issues with integrating into monorepo)
  • Make plugins configurable and add the ability to add additional openapi-ts plugins
  • Support additional client types
  • Configure the project linking for the executor if the API spec is in another project
  • Auto-symlink the packages if in workspace mode, using the native package manager
  • Find or build an OpenAPI diff package that supports OpenAPI 2 through 3.1. We are using api-smart-diff. There haven't been many updates, and there's no Swagger 2 support. We are getting around this by upgrading the Swagger files to OpenAPI v3 files before diffing.
  • List the NX plugin in NX plugin repository

Stretch in this PR:

  • Support different test frameworks (missing jest)
  • Generate linting support (eslint, etc)

Questions:
Q: How to handle updates to the OpenAPI spec file?
A: We have added an executor and a call to each generated project. Each project can run the executor to update the spec file and regenerate the client code.

Q: How do we list the plugin in the NX plugin repository
A: https://nx.dev/extending-nx/recipes/publish-plugin#list-your-nx-plugin

Fixes: #1910

Related PRs:

Copy link

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

Copy link

vercel bot commented Apr 14, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
hey-api-docs ✅ Ready (Inspect) Visit Preview 💬 Add feedback Apr 29, 2025 2:56am

@seriouslag seriouslag force-pushed the feat/add-nx-plugin-2 branch from 37ec549 to d84ba4c Compare April 14, 2025 01:13
Copy link

changeset-bot bot commented Apr 14, 2025

⚠️ No Changeset found

Latest commit: cbd9614

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@seriouslag seriouslag force-pushed the feat/add-nx-plugin-2 branch from d84ba4c to fb901bc Compare April 14, 2025 01:20
@seriouslag seriouslag force-pushed the feat/add-nx-plugin-2 branch from fb901bc to 438dac9 Compare April 14, 2025 01:21
@seriouslag seriouslag changed the title feat(nx-plugin): add nx plugin to generate and update client code feat(nx-plugin): add NX Plugin with OpenAPI client generator and executor Apr 14, 2025
Copy link

codecov bot commented Apr 14, 2025

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 22.17%. Comparing base (5645157) to head (cbd9614).

Additional details and impacted files
@@           Coverage Diff           @@
##             main    #1947   +/-   ##
=======================================
  Coverage   22.17%   22.17%           
=======================================
  Files         251      251           
  Lines       21314    21314           
  Branches      785      784    -1     
=======================================
  Hits         4727     4727           
  Misses      16581    16581           
  Partials        6        6           
Flag Coverage Δ
unittests 22.17% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Copy link

pkg-pr-new bot commented Apr 14, 2025

Open in StackBlitz

@hey-api/client-axios

npm i https://pkg.pr.new/hey-api/openapi-ts/@hey-api/client-axios@1947

@hey-api/client-fetch

npm i https://pkg.pr.new/hey-api/openapi-ts/@hey-api/client-fetch@1947

@hey-api/client-next

npm i https://pkg.pr.new/hey-api/openapi-ts/@hey-api/client-next@1947

@hey-api/client-nuxt

npm i https://pkg.pr.new/hey-api/openapi-ts/@hey-api/client-nuxt@1947

@hey-api/nuxt

npm i https://pkg.pr.new/hey-api/openapi-ts/@hey-api/nuxt@1947

@hey-api/nx-plugin

npm i https://pkg.pr.new/hey-api/openapi-ts/@hey-api/nx-plugin@1947

@hey-api/openapi-ts

npm i https://pkg.pr.new/hey-api/openapi-ts/@hey-api/openapi-ts@1947

@hey-api/vite-plugin

npm i https://pkg.pr.new/hey-api/openapi-ts/@hey-api/vite-plugin@1947

commit: cbd9614

@@ -0,0 +1,11 @@
{
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added this file to cache builds


function App() {
const onClick = async () => {
postFoo({
addPet({
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changed this file to use actual generated code, I was getting type errors how it was

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sample is meant to be a playground for local development and testing. I thought I ignored it in ESLint?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe was an issue with my IDE, why not use actual code instead of adding broken imports and ignoring it with comments?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't remember, I was probably testing something and didn't clean it up. It's similar to the sample snapshot script except it contains a whole app with UI. The idea is to be able to test drive the output since snapshots are never actually executed. Obviously should be way more polished!

@@ -1,7 +1,32 @@
// This file is auto-generated by @hey-api/openapi-ts
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ran the code gen

@@ -10,6 +10,19 @@
"scripts": {
"build": "tsup"
},
"exports": {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Was facing issues with our new configs, adding the exports and adding cjs fixed the issues,

"default": "./dist/index.cjs"
}
},
"./setup": "./src/setup.ts"
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Exporting the setup file as a direct source file for other vitests to use as a setup file.

@@ -0,0 +1,5 @@
// FAIL LOUDLY on unhandled promise rejections / errors
Copy link
Contributor Author

@seriouslag seriouslag Apr 14, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Adding this file because vitest fails if an error is uncaught but no trace is given this will add that. This will help future debugging.

@@ -25,6 +25,7 @@ export function createVitestConfig(
},
},
root,
setupFiles: ['@config/vite-base/setup'],
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Adding our new vitest setup file with the new export path

@@ -2,7 +2,7 @@
"$schema": "./node_modules/turbo/schema.json",
"tasks": {
"build": {
"cache": false,
"cache": true,
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Enabled caching for quicker local dev

});
if (existsSync(v2SpecPath)) {
logger.debug(`Spec file already exists: ${v2SpecPath}`);
await writeFile(v2SpecPath, v2Spec);

Check failure

Code scanning / CodeQL

Potential file system race condition High test

The file may have changed since it
was checked
.
- fix typo in vitest.config output
- change vitest.config to mts for better type support
- list vite and vitest as a dep if enabled
- change vitest to single fork runner
- change build to only output cjs to support nx plugins
- add caching and nx linking if spec file is in another project
- Replace direct mkdir calls with makeDir utility for consistent directory creation.
- Update plugin handling in client generation to support additional plugins.
- Modify tests and schemas to reflect changes in plugin structure and options.
- Improve error handling and logging in updateApi executor.
- Add formatting functionality for generated files and update README for clarity.
- Replace the existing openapi-diff dependency with api-smart-diff for improved comparison accuracy.
- Add comprehensive test cases to validate spec comparison logic across various scenarios.
…verrides in package.json files to support node 18
… management

- Introduce `baseTsConfigName` and `baseTsConfigPath` options in the OpenAPI client generator and update executor schemas.
- Enhance README documentation to reflect new options and their usage.
- Implement `getBaseTsConfigPath` utility to resolve tsconfig paths based on provided options.
- Update tests to cover new tsconfig path handling logic.
- Introduce functions to standardize OpenAPI and Swagger specs, including version detection and conversion.
- Implement `removeExamples` function to clean up specs before comparison, ensuring accurate diff results.
- Add comprehensive tests for new functionality, covering various scenarios for OpenAPI 3.1 and Swagger 2.0 specs.
- Update existing comparison logic to utilize standardized specs for improved accuracy.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Request NX plugin
2 participants