typescript error ts Object is possibly null

When I use Astro to build a website, when I use theme toggle to switch themes, I need to store the value of theme in localStorage. When building, an error of type may be empty will occur.

src/components/ThemeToggle.astro:60:3 - error ts(2531): Object is possibly 'null'.

60   document.getElementById("themeToggle").addEventListener("click", handleToggleClick);
     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
src/components/ThemeToggle.astro:50:40 - error ts(2345): Argument of type 'string | null' is not assignable to parameter of type 'string'.
  Type 'null' is not assignable to type 'string'.

The reason for the error is that ts check data may be empty:

   
  window.localStorage.setItem('theme', theme);

Then let’s add an empty judgment:

  if (theme !== null) {
    window.localStorage.setItem('theme', theme);
  }

Links:

• https://www.typescriptlang.org/