Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Can't get flicking.pkgd.min.js #857

Open
OptimaLPro opened this issue Apr 22, 2024 · 3 comments
Open

Can't get flicking.pkgd.min.js #857

OptimaLPro opened this issue Apr 22, 2024 · 3 comments
Assignees
Labels
🔖4.x v4.x~ related issue ❓Question Asking question about @egjs/Flicking

Comments

@OptimaLPro
Copy link

Description

Hey and Thanks!

I try to use Flicking in my react project.
I attach the dependencies and I don't get the CSS of it.
I checked the links and turned to be that CDN link is not found (https://cdnjs.cloudflare.com/ajax/libs/egjs-flicking/4.x.x/flicking.pkgd.min.js).

The problem its me?
Thanks.

Screenshot 2024-04-22 145212

@malangfox malangfox self-assigned this Apr 23, 2024
@malangfox
Copy link
Contributor

Hello @OptimaLPro.

You can try using https://cdnjs.cloudflare.com/ajax/libs/egjs-flicking/4.11.2/flicking.pkgd.min.js for the latest version of our package.
Links like egjs-flicking/4.x.x might not be available unless you specify a particular version.

@malangfox malangfox added ❓Question Asking question about @egjs/Flicking 🔖4.x v4.x~ related issue labels Apr 23, 2024
@OptimaLPro
Copy link
Author

Oh, i got it.

But still, i'm not able to see the component style.

  1. I installed by npm (npm install @egjs/react-flicking).
  2. added the CDN links (i don't know if i need it, but still, i added it):

`<script src="https://unpkg.com/@egjs/flicking/dist/flicking.pkgd.min.js" crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/egjs-flicking/4.x.x/flicking.pkgd.min.js" crossorigin="anonymous"></script>`
  1. I created a component in my React project, called "FlickingCarousel.jsx" with this code from the Doc:
    `
    import Flicking from "@egjs/react-flicking";
    import "@egjs/react-flicking/dist/flicking.css";
    // Or, if you have to support IE9
    import "@egjs/react-flicking/dist/flicking-inline.css";

export default () => (
<Flicking
align="prev"
circular={true}
onMoveEnd={e => {
console.log(e);
}}>

1

2

3


)
`

  1. I added the "FlickingCarousel.jsx" component to my App.jsx.

The problem is that i can see the 123 (the text from the three divs) but i can't see the style of it.

looks like that: (i used another type of Carousel, the 123 is my try for the Flicking.)

image

I don't know what is the issue with that. When i click on the Network tab in Chrome, i can see that the style files are loaded and all good.

image

What can it be?
I rly want to use it!

@malangfox
Copy link
Contributor

malangfox commented May 8, 2024

@OptimaLPro

Can you check if you are using any style for the flicking-panel class?
You need to set the style of the panel in the flicking-panel class.

For example in this demo, removing the style of the flicking-panel class will show the result as you left above.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🔖4.x v4.x~ related issue ❓Question Asking question about @egjs/Flicking
Projects
None yet
Development

No branches or pull requests

2 participants