[ppawel]

#webdev #frontend

TL;DR Nie umim wrzucić/użyć stylowania bootstrapa w Webpacku

Próbuję użyć zestawu npm+webpack. Dla modułów z samym JS nie mam problemów (chyba). Np. instaluję sobie sobie angulara
npm install angular i mogę się do niego dostać w index.js jak we wszystkich tutkach.

Problem jednak mam z Bootstrapem. Zgodnie z instrukcjami z http://getbootstrap.com/getting-started/#download
zainstalowałem sobie npm install bootstrap, potem w index.js dodaję:

global.jQuery = require('jquery');
require('bootstrap');

I prawie działa - mam bootstrapa, ale nieostylowanego.

Wszędzie piszą, że pakiet bootstrap dostarcza jakieś "style":

Bootstrap's package.json contains some additional metadata under the following keys:

less - path to Bootstrap's main Less source file

style - path to Bootstrap's non-minified CSS that's been precompiled using the default settings (no customization)

I jestem chyba debilem z fontendu, bo nie mam pojęcia jak móc z tego skorzystać w htmlu. Próbuję różnych kombinacji z

ale nic dobrego nie znajduję.

Próbowałem dorzucać też moduły bootstrap-css-loader, bootstrap-sass-loader, ale robię to raczej po omacku i nie nic sensownego z tego nie wychodzi ( ͡° ʖ̯ ͡°)

Pytanie: jak zrobić żeby było ładnie?

[moh1942]

@ppawel: sprawdź dokładnie ścieżkę do plików bootstrapa bo pamiętam że sam musiałem edytować, nazwa plików się różniła

[januzi]

@ppawel: Coś za dużo kropek w tym linku ;)

Firebug i sprawdzasz czy się plik css załadował.

[ppawel]

@januzi: nie no, te .... to tylko placeholder gdzie wstawiałem co mi przyszło do głowy czyli mixy assets / css / dist itp

[ppawel]

Alleluja, stanął!

Miks tego przykładu:
https://github.com/bline/bootstrap-webpack-example
z pierwszą darmową lekcją od jajogłowego
plus poprawiony loader dla woff2

Jest gnój w plikach, ale działa. Porządki muszą zaczekać na inny wieczór który można zmarnować ;)
A bootstrap4 to chyba w ogóle na niewiadomo kiedy...

[bonus]

@ppawel: Jeśli jesteś debilem z frontendu, to lepiej nie używaj Webpacka.

No chyba, że chcesz się pomęczyć, to pokaż config webacka i to jak ładujesz style i jsy. Najlepiej wyślij spakowany projektl.

[ppawel]

@bonus: Taki mniej więcej mam plan.

Ale szanujmy się, w erze gita nie będziemy przesyłać zipków. ( ͡° ͜ʖ ͡°)

[bonus]

@ppawel: Jeśli masz ochotę to poproszę o repo