Integrating React + CSS support

support
1

Hello everyone!

I’ve been able to successfully integrate React into Hugo. However, when I import a CSS file, I get this error message

Error: Error building site: JSBUILD: failed to transform "js/react/components/Test.js" (text/jsx): "/assets/js/react/components/page/Test.jsx:7:7": Cannot import "/assets/js/react/components/page/Test.css" into a JavaScript file without an output path configured

I have my component “Test.jsx” inside the “assets” directory (/assets/js/react/components/page/Test.jsx) and my CSS file in the same directory “/assets/js/react/components/page/Test.css”.

import "./Test.css"

I import the JS this way:

{{ $component := resources.Get "js/react/components/Test.js" | babel }}
{{ $component := $component | js.Build }}

Without the CSS, the React works perfectly, any ideas on what I’m missing? I know the “js.Build” function uses ESBuild, maybe I’m missing some configurations?

Thanks in advance!

2

Check this issue: