Hello,
Thanks for the blog post.
I was also trying to replace webpack with rollup.
In your project, did you managed to have the styles in the global.css file correctly bundled?
I follow those steps, and I didn't managed to got the styles from the global.css applied on the welcome page for example.
It seems that this replacement is lacking regular CSS bundling (the one that are by default loaded with css-loader in webpack)
I'm interesting to know what should be the correct configuration in rollup..
If you have any idea, I'll be happy to look into it..
It should work for CSS too.
The global.css is imported inside main.js, inside rollup.config.js the css gets written to app.css.
Are you importing app.css in your layout?
Take a look at the example project: github.com/joshnuss/phoenix_svelte...
Let me know if it's still now working for you.
Hi OP and thank you for such a quick reply!
Indeed, I tried your repo from scratch and it worked then I redo from scratch on my side, and the problem was that I was keeping an @import "./phoenix.css statement at the top of my global.css file.
If I remove that statement and for example either import it from the JS side (like we already did on main.js like so import "../css/global.css" or simply by copy/pasting its content.
Do you know if it's possible with Rollup to @import CSS files within CSS files?
I'll probably need this anyway because of other library having those kind of @import?
Hello,
Thanks for the blog post.
I was also trying to replace webpack with rollup.
In your project, did you managed to have the styles in the global.css file correctly bundled?
I follow those steps, and I didn't managed to got the styles from the global.css applied on the welcome page for example.
It seems that this replacement is lacking regular CSS bundling (the one that are by default loaded with css-loader in webpack)
I'm interesting to know what should be the correct configuration in rollup..
If you have any idea, I'll be happy to look into it..
Hi @akaibukai ,
It should work for CSS too.
The
global.css
is imported insidemain.js
, insiderollup.config.js
the css gets written toapp.css
.Are you importing
app.css
in your layout?Take a look at the example project: github.com/joshnuss/phoenix_svelte...
Let me know if it's still now working for you.
Hi OP and thank you for such a quick reply!
Indeed, I tried your repo from scratch and it worked then I redo from scratch on my side, and the problem was that I was keeping an
@import "./phoenix.css
statement at the top of myglobal.css
file.If I remove that statement and for example either import it from the JS side (like we already did on
main.js
like soimport "../css/global.css"
or simply by copy/pasting its content.Do you know if it's possible with Rollup to
@import
CSS files within CSS files?I'll probably need this anyway because of other library having those kind of
@import
?Again thank you for taking the time to answer..
Happy to help :)
Try importing
phoenix.css
insidemain.js
:Alternatively, postcss-import might do it, though I haven't tried it myself.