How does transpile of style imports get informed about style processing?

Question

I have this Widget.tsx file which says import './Widget.scss'.

The build is kind of odd, it says webpack --config webpack.config.js && tsc.

This webpack.config.js has a rule for processing styles including scss files, but no rule for processing tsx files.

I think I can improve it by bringing the tsc step into the webpack.config.js. That shouldn't be a problem, I've written webpack configs for React apps including typescript before.

But this raises a conceptual question for me. The result of this build, as it stands, includes Widget.js that still has the line import './Widget.scss'. Of course there's no ./Widget.scss in the build output and this is broken.

Given the build instruction it makes sense, because tsc can't independently know much about what to do differently with this line.

But even when the tsx files are processed in the same webpack job as the styles, how is it that the style processing can inform tsc (or babel) about what to do with style imports?