2012-02-03 10 views
11

Próbuję więc "zbudować" bootstrap Twittera ze źródła git: //github.com/twitter/bootstrap.git i skopiuję go na moją maszynę lokalną.twitter bootstrap make from source

Oczywiście na mojej lokalnej maszynie miałem zainstalowane nodejs i npm, a także wymagane pakiety węzłów mniej, a także uglify-js. Wszystkie moduły węzłów znajdują się w mojej ścieżce systemowej, więc komendy "lessc" i "uglifyjs" są dostępne w moim terminalu.

Wchodząc do katalogu bootstrap za biegnę "make" i to jest wyjście: -

(luc)calvins-MacBook.local ttys002 Fri Feb 03 10:51:29 |~/work/luc/static/bootstrap| 
calvin$ make 
mkdir -p bootstrap/img 
mkdir -p bootstrap/css 
mkdir -p bootstrap/js 
cp img/* bootstrap/img/ 
lessc ./less/bootstrap.less > bootstrap/css/bootstrap.css 
lessc --compress ./less/bootstrap.less > bootstrap/css/bootstrap.min.css 
lessc ./less/responsive.less > bootstrap/css/bootstrap.responsive 
lessc --compress ./less/responsive.less > bootstrap/css/bootstrap.min.responsive 
cat js/bootstrap-transition.js js/bootstrap-alert.js js/bootstrap-button.js js/bootstrap-carousel.js js/bootstrap-collapse.js js/bootstrap-dropdown.js js/bootstrap-modal.js js/bootstrap-tooltip.js js/bootstrap-popover.js js/bootstrap-scrollspy.js js/bootstrap-tab.js js/bootstrap-typeahead.js > bootstrap/js/bootstrap.js 
uglifyjs -nc bootstrap/js/bootstrap.js > bootstrap/js/bootstrap.min.js 
zip -r docs/assets/bootstrap.zip bootstrap 
updating: bootstrap/ (stored 0%) 
updating: bootstrap/css/ (stored 0%) 
updating: bootstrap/css/bootstrap.css (deflated 85%) 
updating: bootstrap/css/bootstrap.min.css (deflated 84%) 
updating: bootstrap/css/bootstrap.min.responsive (deflated 76%) 
updating: bootstrap/css/bootstrap.responsive (deflated 79%) 
updating: bootstrap/img/ (stored 0%) 
updating: bootstrap/img/glyphicons-halflings-white.png (deflated 4%) 
updating: bootstrap/img/glyphicons-halflings.png (deflated 4%) 
updating: bootstrap/js/ (stored 0%) 
updating: bootstrap/js/bootstrap.js (deflated 82%) 
updating: bootstrap/js/bootstrap.min.js (deflated 74%) 
rm -r bootstrap 
lessc ./less/bootstrap.less > ./docs/assets/css/bootstrap.css 
lessc ./less/responsive.less > ./docs/assets/css/bootstrap-responsive.css 
node docs/build 
cp img/* docs/assets/img/ 
cp js/*.js docs/assets/js/ 
cp js/tests/vendor/jquery.js docs/assets/js/ 
cp js/tests/vendor/jquery.js docs/assets/js/ 

Co mam zrobić aby to moje pliki css w mojej stronie html? Nie widzę, gdzie znajdują się wbudowane/utworzone pliki bootstrap.min.css lub bootstrap.min.responsive. Wydawało się, że zmieniło się tylko "bootstrap.zip", co widać po uruchomieniu git statusu powyżej.

(luc)calvins-MacBook.local ttys002 Fri Feb 03 10:51:35 |~/work/luc/static/bootstrap| 
calvin$ git status 
# Not currently on any branch. 
# Changes not staged for commit: 
# (use "git add <file>..." to update what will be committed) 
# (use "git checkout -- <file>..." to discard changes in working directory) 
# 
# modified: docs/assets/bootstrap.zip 
# 
no changes added to commit (use "git add" and/or "git commit -a") 

Odpowiedz

20

Nie ekspertem w tej sprawie przez odcinku wyobraźni (właśnie rozpoczął się bawić z Twittera bootstrap, jak również), ale pojawia się podobny wynik jak ty po prostu uruchomić make. Jednakże, jeśli uruchomić make bootstrap generuje folder zatytułowany bootstrap który zawiera skompilowany css miarę mogę powiedzieć:

make bootstrap 
mkdir -p bootstrap/img 
mkdir -p bootstrap/css 
mkdir -p bootstrap/js 
cp img/* bootstrap/img/ 
lessc ./less/bootstrap.less > bootstrap/css/bootstrap.css 
lessc --compress ./less/bootstrap.less > bootstrap/css/bootstrap.min.css 
lessc ./less/responsive.less > bootstrap/css/bootstrap-responsive.css 
lessc --compress ./less/responsive.less > bootstrap/css/bootstrap-responsive.min.css 
cat js/bootstrap-transition.js js/bootstrap-alert.js js/bootstrap-button.js js/bootstrap-carousel.js js/bootstrap-collapse.js js/bootstrap-dropdown.js js/bootstrap-modal.js js/bootstrap-tooltip.js js/bootstrap-popover.js js/bootstrap-scrollspy.js js/bootstrap-tab.js js/bootstrap-typeahead.js > bootstrap/js/bootstrap.js 
uglifyjs -nc bootstrap/js/bootstrap.js > bootstrap/js/bootstrap.min.js 

Nowy bootstrap katalog (bootstrap/bootstrap) zawiera następujące elementy:

bootstrap/css: 
- bootstrap-responsive.css 
- bootstrap-responsive.min.css 
- bootstrap.css 
- bootstrap.min.css 

bootstrap/img: 
- glyphicons-halflings-white.png 
- glyphicons-halflings.png 

bootstrap/js: 
- bootstrap.js 
- bootstrap.min.js 

ten może być problem z dokumentacją, pomijając poprawne polecenie, ale nie jestem pewien. Pamięć o tym, jak działa Makefile, jeśli wydasz make bez celu, domyślnie jest pierwszym celem pliku Makefile. W tym przypadku celem jest docs zamiast bootstrap.

Myślę, że możesz skopiować zawartość nowego katalogu bootstrap tam, gdzie normalnie umieścisz zasoby css/js dla twojego projektu.

+2

Dzięki! Twoja uwaga o tym, jak 'Makefile' działa, gdy' make' jest wydawane bez celu, wyjaśnia moją niepewność. Doceniam to. –

+0

Dzięki! Twoja odpowiedź była dla mnie pomocna. – RDK

+0

Czy 'make' jest wciąż aktualne w nowych wersjach Bootstrapa? Wygląda na to, że musimy użyć ['grunt'] (https://github.com/twbs/bootstrap#compiling-css-and-javascript), prawda? –

3

Jeśli ktoś szuka alternatywy dla make na budowę Bootstrap (zwłaszcza, że ​​nie jest Windows make przyjazny), istnieje build system for Bootstrap with Grunt.js

Dla większości to daje te same wyniki jak makefile. Zadanie-contrib-qunit zapewni lepszą obsługę qunit/phantomjs po zwolnieniu kroku 0.4.0 (tutaj: https://github.com/gruntjs/grunt-contrib-qunit). Do tego czasu możesz nadal pracować z wbudowanymi zadaniami Grunt do testowania.

+0

to jest nieaktualne i prawdopodobnie już nie działa. Przekażę raport, jeśli będę miał czas, aby go zaktualizować. – jonschlinkert

0

Mam GnuWin32 zainstalowany i na mojej drodze, a ja npm install -ED uglifyjs, recess i jshint. Następnie się następujące dodatki do góry Makefile:

SHELL=c:/windows/system32/cmd.exe 
MKDIR=mkdir.exe -p 
UGLIFYJS=uglifyjs 
RECESS=recess 
JSHINT=jshint 

pierwszego (Shell =) rozwiązuje ten problem:

w:\github\bootstrap>make bootstrap 
mkdir.exe -p bootstrap/js 
make: Interrupt/Exception caught (code = 0xc00000fd, addr = 0x4227d3) 

druga linia (MKDIR =) jest zapobieganie DOS Używana komenda mkdir (która nie rozumie flagi -p).

Następnie wyszukiwanie globalne/wymienić wszystkich odniesień wykonywalnych:

-  mkdir -p bootstrap/js 
+  $(MKDIR) bootstrap/js 
     cat js/bootstrap-transition.js js.. 
-  ./node_modules/.bin/uglifyjs -nc... 
+  $(UGLIFYJS) -nc bootstrap/js/boot.. 
etc. 

Teraz make bootstrap wykończenia bez żadnych problemów.

1

To może być przydatne dla niektórych z was. Informacje na temat użytkowania/opcji można znaleźć w pliku Readme. Jest to prosta partia do kompilacji bootstrapu ze źródła w systemie Windows. https://github.com/chazelton/bootstrap. Możesz także po prostu pobrać "make.bat", jeśli chcesz i upuść go w pobranym źródle. Jest tu rozwidlony dla wygody. Podstawowe użycie poniżej

C:\projects\bootstrap>make (would create sub dir "build" with css, js, img dirs) 
C:\projects\bootstrap>make -c (combines bootstrap/responsive to one file) 
C:\projects\bootstrap>make -l (outputs source less files under css dir) 

zobaczyć dodatkowe opcje w readme na GitHub ...

UWAGA: wymaga UglifyJs i mniej do zainstalowania przez KMP globalnie tak => npm zainstalować mniej -g. Ta partia zapyta, czy ich nie ma. Jednak musisz zainstalować je ręcznie.

-1

należy pobrać niektóre pakiety pierwszy węzeł

Spróbuj

sudo npm install recess 

a następnie

sudo npm install jshint 

Następnie użyj

make bootstrap 

w katalogu makefile