pavinduLakshan commented 3 months ago

Is your feature request related to a problem? Please describe.

The current monorepo build tooling relies on Yarn, which, while effective, does not offer the same performance optimizations, workspace management, and task orchestration provided by newer tools like PNPM and NX. Additionally, the current release process lacks automation for managing versioning and changelogs, which can be improved with Changesets. As the project scales, upgrading the tooling will enhance the development workflow and ensure smoother releases.

Describe the solution you would prefer

We propose migrating the build tooling to use PNPM for efficient package management, NX for optimized build performance and task orchestration, and Changesets for automated versioning and changelog generation. The migration will include:

Replacing Yarn with PNPM to leverage faster installs and workspace management.
Integrating NX for improved build processes and incremental builds across the monorepo.
Incorporating Changesets to automate version control and changelog updates.
Updating scripts and CI configurations to support the new tooling.
Verifying compatibility and functionality across all packages.

Additional context

This migration will involve updating developer documentation and ensuring all workflows operate seamlessly with the new tools. The transition is aimed at improving developer experience, build efficiency, and release management.

abhiram6121 commented 1 month ago

@NipuniBhagya, I would like to work on this issue. Could you please assign it to me?

pavinduLakshan commented 1 month ago

@NipuniBhagya, I would like to work on this issue. Could you please assign it to me?

Hi @abhiram6121 , just assigned the issue to you. Please feel free to get back if there's anything to clarify.

abhiram6121 commented 1 month ago

@NipuniBhagya, I would like to work on this issue. Could you please assign it to me?

Hi @abhiram6121 , just assigned the issue to you. Please feel free to get back if there's anything to clarify.

Do we need Lerna after migrating to PNPM?

pavinduLakshan commented 1 month ago

@NipuniBhagya, I would like to work on this issue. Could you please assign it to me?

Hi @abhiram6121 , just assigned the issue to you. Please feel free to get back if there's anything to clarify.

Do we need Lerna after migrating to PNPM?

No, we don't.

pavinduLakshan commented 1 month ago

@abhiram6121 I updated the issue description to add integrating Changesets[1] to the task list. Please let me know if there are any concerns. Cheers!

[1] https://github.com/changesets/changesets

abhiram6121 commented 1 month ago

@pavinduLakshan

> cd apps/client && pnpm run build
> client@1.1.18 build /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express/apps/client
> CI=false && react-scripts build

Creating an optimized production build...
Failed to compile.

[eslint] Invalid Options:
- Unknown options: extensions, resolvePluginsRelativeTo
- 'extensions' has been removed.
- 'resolvePluginsRelativeTo' has been removed.

 ELIFECYCLE  Command failed with exit code 1.
 ELIFECYCLE  Command failed with exit code 1.

I am facing an error related to ES lint while building samples/asgardeo-choreo-react-express/apps/client. Should I disable ES lint plugin for this repo?

pavinduLakshan commented 1 month ago

@pavinduLakshan

> cd apps/client && pnpm run build
> client@1.1.18 build /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express/apps/client
> CI=false && react-scripts build

Creating an optimized production build...
Failed to compile.

[eslint] Invalid Options:
- Unknown options: extensions, resolvePluginsRelativeTo
- 'extensions' has been removed.
- 'resolvePluginsRelativeTo' has been removed.

 ELIFECYCLE  Command failed with exit code 1.
 ELIFECYCLE  Command failed with exit code 1.

I am facing an error related to ES lint while building samples/asgardeo-choreo-react-express/apps/client. Should I disable ES lint plugin for this repo?

Did you attempt to update the eslint version? latest eslint version (v9) has some breaking changes that can cause existing eslint configs to break.

Better if you can open a draft PR with your current changes so far, so that I can take a look and help.

abhiram6121 commented 1 month ago

@pavinduLakshan
> cd apps/client && pnpm run build
> client@1.1.18 build /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express/apps/client
> CI=false && react-scripts build

Creating an optimized production build...
Failed to compile.

[eslint] Invalid Options:
- Unknown options: extensions, resolvePluginsRelativeTo
- 'extensions' has been removed.
- 'resolvePluginsRelativeTo' has been removed.

 ELIFECYCLE  Command failed with exit code 1.
 ELIFECYCLE  Command failed with exit code 1.
I am facing an error related to ES lint while building samples/asgardeo-choreo-react-express/apps/client. Should I disable ES lint plugin for this repo?
Did you attempt to update the eslint version? latest eslint version (v9) has some breaking changes that can cause existing eslint configs to break.

Better if you can open a draft PR with your current changes so far, so that I can take a look and help.

I tried downgrading the eslint version, but still getting the same error.

PR : https://github.com/asgardeo/asgardeo-auth-react-sdk/pull/255

pavinduLakshan commented 1 month ago

@abhiram6121 I tried with your changes in the draft PR and sample app build worked for me.

Try the following steps and see if it fixes the issue.

Delete all node_modules, dist, build folders in the repo.
Run pnpm install from the project root (from asgardeo-auth-react-sdk directory).
Switch to samples/asgardeo-choreo-react-express and run pnpm build

abhiram6121 commented 1 month ago

@abhiram6121 I tried with your changes in the draft PR and sample app build worked for me.

Try the following steps and see if it fixes the issue.

Delete all node_modules, dist, build folders in the repo.

Run pnpm install from the project root (from asgardeo-auth-react-sdk directory).

Switch to samples/asgardeo-choreo-react-express and run pnpm build

I am still getting the same error. I even tried recloning the repo from here. I am using Volta to install PNPM and node. Does that cause any issues?

abhiram6121 commented 1 month ago

❯ git clone git@github.com:abhiram6121/asgardeo-auth-react-sdk.git
Cloning into 'asgardeo-auth-react-sdk'...
remote: Enumerating objects: 8374, done.
remote: Counting objects: 100% (1044/1044), done.
remote: Compressing objects: 100% (178/178), done.
remote: Total 8374 (delta 898), reused 957 (delta 865), pack-reused 7330 (from 1)
Receiving objects: 100% (8374/8374), 4.49 MiB | 1.13 MiB/s, done.
Resolving deltas: 100% (5892/5892), done.
❯ cd asgardeo-auth-react-sdk
❯ git checkout "pnpm"
branch 'pnpm' set up to track 'origin/pnpm'.
Switched to a new branch 'pnpm'
❯ pnpm install
Scope: all 5 workspace projects
Lockfile is up to date, resolution step is skipped
Packages: +1581
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Progress: resolved 1581, reused 1569, downloaded 0, added 1581, done

devDependencies:
+ @typescript-eslint/eslint-plugin 5.62.0
+ @typescript-eslint/parser 5.62.0
+ eslint 8.57.1
+ eslint-plugin-import 2.31.0
+ rimraf 3.0.2
+ typescript 4.9.5

Done in 2.8s
❯ cd samples/asgardeo-choreo-react-express
❯ pnpm build

> @asgardeo/choreo-react-express@5.2.0 prebuild /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> curr_dir=$(pwd) && pnpm run install:client && cd $curr_dir && pnpm run install:server

> @asgardeo/choreo-react-express@5.2.0 install:client /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> cd apps/client && CI=false pnpm install

Scope: all 5 workspace projects
Done in 1.4s

> @asgardeo/choreo-react-express@5.2.0 install:server /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> cd apps/server && pnpm install

Scope: all 5 workspace projects
Done in 1.4s

> @asgardeo/choreo-react-express@5.2.0 build /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> curr_dir=$(pwd) && pnpm run build:client && cd $curr_dir && pnpm run build:server

> @asgardeo/choreo-react-express@5.2.0 build:client /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> cd apps/client && pnpm run build

> client@1.1.18 build /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express/apps/client
> CI=false && react-scripts build

Creating an optimized production build...
Failed to compile.

[eslint] Invalid Options:
- Unknown options: extensions, resolvePluginsRelativeTo
- 'extensions' has been removed.
- 'resolvePluginsRelativeTo' has been removed.

 ELIFECYCLE  Command failed with exit code 1.
 ELIFECYCLE  Command failed with exit code 1.
 ELIFECYCLE  Command failed with exit code 1.
❯

abhiram6121 commented 1 month ago

@abhiram6121 I tried with your changes in the draft PR and sample app build worked for me. Try the following steps and see if it fixes the issue.

Delete all node_modules, dist, build folders in the repo.

Run pnpm install from the project root (from asgardeo-auth-react-sdk directory).

Switch to samples/asgardeo-choreo-react-express and run pnpm build

I am still getting the same error. I even tried recloning the repo from here. I am using Volta to install PNPM and node. Does that cause any issues?

❯ pnpm build

> @asgardeo/choreo-react-express@5.2.0 prebuild /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> curr_dir=$(pwd) && pnpm run install:client && cd $curr_dir && pnpm run install:server

> @asgardeo/choreo-react-express@5.2.0 install:client /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> cd apps/client && CI=false pnpm install

Scope: all 5 workspace projects
Done in 2.5s

> @asgardeo/choreo-react-express@5.2.0 install:server /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> cd apps/server && pnpm install

Scope: all 5 workspace projects
Done in 2.6s

> @asgardeo/choreo-react-express@5.2.0 build /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> curr_dir=$(pwd) && pnpm run build:client && cd $curr_dir && pnpm run build:server

> @asgardeo/choreo-react-express@5.2.0 build:client /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> cd apps/client && pnpm run build

> client@1.1.18 build /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express/apps/client
> CI=false && react-scripts build

Creating an optimized production build...
Failed to compile.

TS2339: Property 'toBeInTheDocument' does not exist on type 'JestMatchers<HTMLElement>'.
    24 |   render(<App />);
    25 |   const linkElement = screen.getByText(/learn react/i);
  > 26 |   expect(linkElement).toBeInTheDocument();
       |                       ^^^^^^^^^^^^^^^^^
    27 | });
    28 |

 ELIFECYCLE  Command failed with exit code 1.
 ELIFECYCLE  Command failed with exit code 1.
 ELIFECYCLE  Command failed with exit code 1.

Resolved eslint error, but getting a new error related to jest.

abhiram6121 commented 1 month ago

@abhiram6121 I tried with your changes in the draft PR and sample app build worked for me. Try the following steps and see if it fixes the issue.

Delete all node_modules, dist, build folders in the repo.

Run pnpm install from the project root (from asgardeo-auth-react-sdk directory).

Switch to samples/asgardeo-choreo-react-express and run pnpm build

I am still getting the same error. I even tried recloning the repo from here. I am using Volta to install PNPM and node. Does that cause any issues?

❯ pnpm build

> @asgardeo/choreo-react-express@5.2.0 prebuild /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> curr_dir=$(pwd) && pnpm run install:client && cd $curr_dir && pnpm run install:server

> @asgardeo/choreo-react-express@5.2.0 install:client /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> cd apps/client && CI=false pnpm install

Scope: all 5 workspace projects
Done in 2.5s

> @asgardeo/choreo-react-express@5.2.0 install:server /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> cd apps/server && pnpm install

Scope: all 5 workspace projects
Done in 2.6s

> @asgardeo/choreo-react-express@5.2.0 build /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> curr_dir=$(pwd) && pnpm run build:client && cd $curr_dir && pnpm run build:server

> @asgardeo/choreo-react-express@5.2.0 build:client /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express
> cd apps/client && pnpm run build

> client@1.1.18 build /home/armdebug/asgardeo-auth-react-sdk/samples/asgardeo-choreo-react-express/apps/client
> CI=false && react-scripts build

Creating an optimized production build...
Failed to compile.

TS2339: Property 'toBeInTheDocument' does not exist on type 'JestMatchers<HTMLElement>'.
    24 |   render(<App />);
    25 |   const linkElement = screen.getByText(/learn react/i);
  > 26 |   expect(linkElement).toBeInTheDocument();
       |                       ^^^^^^^^^^^^^^^^^
    27 | });
    28 |

 ELIFECYCLE  Command failed with exit code 1.
 ELIFECYCLE  Command failed with exit code 1.
 ELIFECYCLE  Command failed with exit code 1.

Resolved eslint error, but getting a new error related to jest.

23000795

asgardeo / asgardeo-auth-react-sdk

Migrate build tooling to PNPM and NX #246

Is your feature request related to a problem? Please describe.

Describe the solution you would prefer

Additional context

Resolved https://stackoverflow.com/a/75245402/23000795