I've been immersing myself in react recently and have a question about react+scss.
I understand the difference between babel and webpack and their respective purpose when getting a react app to work in the browser. What I still don't understand is what's needed if I'm just trying to create a react npm package for react components.
My package at first only had a pure javascript/react component and I simply transpiled it with babel to commonJS, worked well. No webpack needed. I then added an additional component that now included scss:
import styles from '../styles/calendar.scss'
In package.json I added
"sass-loader" and "node-sass"
In storybook, everything works, but when I transpile my src directory with babel, the scss/css code is missing, which is obviously expected as babel is just a js transpiler.
My question is whether I really need webpack to get the scss in my react package working or if there is a way to do that purely with babel since so far I had no need for webpack. Babel transpile gave me nicely transpiled js files that still respected the folder structure of my src folder. I ideally don't want a completely bundled index.js file that has all in one.
Bottom line question, do you need more than pure babel as soon as you're dealing with scss?
Any help would be appreciated!