ReferenceError: Can't find variable: LdrsBaseElement

[MarioPeperoni]

I'm encountering an error in my Next.js application where the loader is not functioning. This started today when I attempted to add new features and launch the server. I get ReferenceError: Can't find variable: LdrsBaseElement My dev environment matches the production branch, which compiled perfectly a week ago (still works fine in production).

Any ideas what could be causing this? Happy to provide more details if needed!

Here is the code:

const TableLoading = ({ withSpinner }: { withSpinner?: boolean }) => {
  withSpinner && import('ldrs/ring2');
  return (
    <div className="animate-pulse">
      <div className="overflow-x-auto">
        <div className="align-middle inline-block min-w-full">
          <div className="overflow-hidden border-t border-gray-200">
            <div className="min-w-full">
              <div className="h-[48px] px-6 bg-neutral-200"></div>
            </div>
            <div className="h-[530px] px-6 bg-neutral-100 items-center flex justify-center">
              {withSpinner && (
                <l-ring-2
                  size={50}
                  stroke={5}
                  stroke-length={0.25}
                  bg-opacity={0.1}
                  speed={0.9}
                  color={'#3b82f6'}
                />
              )}
            </div>
          </div>
        </div>
      </div>
    </div>
  );
};

export default TableLoading;

[GriffinJohnston]

Interesting. You're saying it was working before and suddenly stopped? Did you upgrade your NextJS version?

For an immediate fix, try using one of the recommended methods in the Next guide: https://github.com/GriffinJohnston/ldrs/blob/main/framework-guides.md#nextjs

Here's the useEffect method:

useEffect(() => {
  async function getLoader() {
    const { ring2 } = await import('ldrs')
    ring2.register()
  }
  getLoader()
}, [])

[MarioPeperoni]

Hey! Yes, I had week break from coding and when I came back to project it just stopped working. Updating all packages did not fix the problem. I didn't figure it out and I just made my own spinner from scratch. Thanks for help tho