Tailwind Dark and Light Theme implementation error

[24Degrees]

Good day to you all,

I would like to report the following error:

Errormessage: "Uncaught TypeError: Cannot read properties of null (reading 'classList')"

When: Occurs when trying to follow the dark and light theme implementation of Tailwind CSS using this guide: https://tailwindcss.com/docs/dark-mode Or the Flowbite guide: https://flowbite.com/docs/customize/dark-mode/

Cause: JS is executed before the HTML has been build.

Solution: add the parameter true at the end of enqueuing the JS-files in functions.php so all JS-files load in the HTML footer.

Example with error:

wp_enqueue_script( 'tailpress', levatus_asset( 'js/app.js' ), array(), $theme->get( 'Version' ) );
wp_enqueue_script( 'flowbite', levatus_asset( 'node_modules/flowbite/dist/flowbite.js' ), array(), $theme->get( 'Version' ) );

Example solved, adding true for loading JS in footer:

wp_enqueue_script( 'tailpress', levatus_asset( 'js/app.js' ), array(), $theme->get( 'Version' ), true);
wp_enqueue_script( 'flowbite', levatus_asset( 'node_modules/flowbite/dist/flowbite.js' ), array(), $theme->get( 'Version' ), true);

Thanks for the outstanding job Jeffrey,

kind regards,

Michael 24degrees