I’m having a problem with the Slick Slider. In Plasmic Studio, the slider isn’t broken, but when the build occurs, the slider kind of loses its style.
Some component packages require you to import some CSS when using codegen. For react slick you need to import
slick-carousel/slick/slick.css in your code.
When you use the CLI to sync a project with component packages that require this type of import, you should see a message like this
Do I have to insert by custom css?
I meant you need to import the css in code, in the place your app imports global css. For next it’s usually in the _app.js file
If I’m using codegen, do I only have this way?
I was thinking that using the library inside Plasmic does not imply that I need to import it into my code.
But I recognize that it might present a means of developing a fresh look at the code.
It should already be in your
plasmic.json. The loader use case does not require you to have the package, but the codegen does. For codegen we don’t automatically add this css because we don’t want to change an user created file (_app.js) which could have a lot of other stuff that could break.
Is there any guide to follow to import these styles?
The main issue with this is that even if I wanted to use it, I would still have to import the code, which would slow down my workflow.
I’m the designer of the company. I can code, but there are a lot of processes inside our team and I only wanted to use the slider style.
Hi @miniature_horse! Yeah this is just a limitation of codegen vs the API - you just have to add the CSS one time, I think it could look something like this:
That was from https://react-slick.neostack.com/docs/get-started/
for NextJs there’s also this documentation of how to do it using
_app.tsx : https://nextjs.org/docs/basic-features/built-in-css-support#adding-a-global-stylesheet
Thanks for helping me.
Here is a repo that shows
create-plasmic-app yarn add react-slick slick-carousel // Then in you import "slick-carousel/slick/slick.css"; import "slick-carousel/slick/slick-theme.css";
Please let me know if this helps! https://github.com/plasmicapp/just-slider