Creating a texture map from an object with multiple textures?

I’m trying to separate and bake my textures from my model, so I can load them separately in THREE.js. I’ve tried to make texture maps using UV editor but I can’t seem to get it working. Whenever I try to bake the textures I just get a black png file as a result.

I tried to join all my meshes together then use the uv editor then bake. I also tried to select all the meshes then smart uv then bake nothing. Frankly, I don’t know what I’m doing. So there’s a good chance I messed up during the process.

My process:
Create an image texture
go to uv editor select my image texture
create image texture node then select the image texture ( I have no clue where to put the image texture node when all the meshes aren’t joined).
go to cycles then bake.

Here’s what my uv map usually looks like.

I would appreciate it if someone could help me. I’ve watched so many videos and always end up the same. Any guidelines and instructions would be nice.

Solved it. How? I have zero clue.

Baking is hard.