Loading CSS with Webpack/Yarn

niedfelj commented 6 years ago

Could you document/explain how to load the CSS properly using yarn/npm and webpack?

desandro commented 6 years ago

Thanks for reporting this issue.

Unfortunately, I do not have much expertise working with Webpack. An initial web search yields a couple results:

Please chime if you can provide some guidance here 🙏

niedfelj commented 6 years ago

I was able to get it to work using this in my .scss

@import "~flickity/css/flickity.css";

It would be great if it could just use the package.json style tag that you have setup or else if you could make it a dependency in your .js, but I guess that would only work if they were using webpack with the right loaders?

maxcr commented 6 years ago

import it inside your js unless you want webpack to spit out an accompanying css/js file. (js with css embedded)

graygilmore commented 6 years ago

If anyone else stumbles across this I was able to do this in JS by:

import 'flickity/dist/flickity.min.css';
import Flickity from 'flickity';

// do Flickity things
// new Flickity(el, options);

maxcr commented 4 years ago

There was but its lost to me now. It had something to do with pathing issues as Webpack was originally created on a Windows OS some some file paths had to be aliased if you're on Linux or Mac like I was.

On Mon, Feb 10, 2020 at 5:22 AM Drew Scott notifications@github.com wrote:

@niedfelj https://github.com/niedfelj @desandro https://github.com/desandro @graygilmore https://github.com/graygilmore is this still the right way to do it in 2020? Rails now uses Webpack by default, not sure if it did it back then as well, but there's gotta be a better way?

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/metafizzy/flickity/issues/754?email_source=notifications&email_token=AAJNDRWMU75CV7JFEMDI2KTRCFBGTA5CNFSM4E5LEVYKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOELIJ2YI#issuecomment-584097121, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAJNDRQWVDZR42WDTDXIYK3RCFBGTANCNFSM4E5LEVYA .

anon987654321 commented 4 years ago

@niedfelj @maxcr @graygilmore are you guys still using Flickity with Webpack/Yarn? If so did you ever encounter this issue?

https://github.com/metafizzy/flickity/issues/1077

Thanks!

metafizzy / flickity

Loading CSS with Webpack/Yarn #754