Is there any way to have Prettier format JavaScript differently than the JSX in React in the same file, mainly just making the tabWidth for JS 4 and for JSX 2?

Should I be changing the file extension to .jsx and not .js, or will this at least make it so that if I move all my components to be rendered entirely in their own file with props, I can call those .jsx files and it will format them with tabWidth 2 and then keep functions and other things in a separate JS file that will be formatted with tabWidth 4?