Jak zaktualizować i dodać Twitter Bootstrap 3 na webapp lub yo kanciastą?

Użyłem yo webapp lub yo angleular do stworzenia nowego projektu, a ja otrzymałem Bootstrap include to wersja 2.3.2, ale chcę używać najnowszej wersji Bootstrap.Jak zaktualizować i dodać Twitter Bootstrap 3 na webapp lub yo kanciastą?

Jak mogę zaktualizować pakiet Bootstrap za pomocą wiersza polecenia, a następnie zaktualizować po utworzeniu nowego webapp lub yo kanciastego, wybierz to, czy Twitter Bootstrap to ostatnia wersja?

Źródło

2013-08-24 Loc_rabbirt

Dla każdego, kto próbuje użyć v3 z generatorem kątowym, projekt został właśnie zaktualizowany. Przejdź do [tego problemu] (https://github.com/yeoman/generator-angular/pull/429) i postępuj zgodnie z instrukcjami. – user1724490

Sieciowy generator Yeomka & generatory kątowe chwytają Sass dla Bootstrap, który jest oparty na wersji 2.3.2 z Twittera Bootstrapa.

Po uruchomieniu yo webapp lub yo angular można dodać Bootstrap 3.0, uruchamiając następujące polecenie.

$ bower install --save bootstrap

To spowoduje pobranie Bootstrap 3.0 dla Ciebie.

Źródło

2013-08-24 19:11:34 micjamking

D: \ Web Design \ HTML-CSS \ Bootstrap testowy> altana zainstalować flagą --save bootstrap altana klonowania git: //github.com/twbs/bootstrap.git C: \ Users \ TienLoc \ AppData \ Roaming \ npm \ node_modules \ bower \ node_modules \ tmp \ lib \ tmp .js: 260 throw err; ^ ^ Błąd: spawn ENOENT w errnoException (child_process.js: 980: 11) w Process.ChildProcess._handle.onexit (child_process.js: 771: 34) ------------------------------------------- -------------------------------------------------- ---- Otrzymałem błąd, gdy polecenie wymuszenia –

Czy Git jest zainstalowany i dostępny w 'PATH'? – micjamking

Zainstalowałem Git, ale nie jest dostępny w mojej PATH i dodaję go do mojej PATH, ale nie rozwiązuję problemów. –

@micjamking odpowiedź jest bardzo dobra wskazówka, ale ponieważ z Yeoman rzeczy powinno być łatwiejsze, będę zaoszczędzić trochę googling:

yo angular - powiedzieć „nie” bootstrap tutaj - w przeciwnym razie będzie pobierz wersję 2.x
bower install --save bootstrap
npm install --save-dev grunt-bower-install

edit Gruntfile.js - wstaw zaznaczone linie:

// ... 
} catch (e) {} 

grunt.loadNpmTasks('grunt-bower-install');    // INSERT 

grunt.initConfig({ 
    yeoman: yeomanConfig, 
    'bower-install': {         // INSERT BEGIN 
     target: {          // . 
      html: '<%= yeoman.app %>/index.html',  // . 
      ignorePath: '<%= yeoman.app %>/'   // . 
     }            // . 
    },             // INSERT END 
    watch: { 
     coffee: { 
      files: ['<%= yeoman.app %>/scripts/{,*/}*.coffee'], 
      tasks: ['coffee:dist'] 
// ...

edit app/index.html - wkładka:
```
 
 
```
oraz:
```
 
 
```
w stosownych przypadkach - tych wstrzyknie odniesień do Bower zarządzane zasoby (stylesheet Bootstrap i JS w naszym przypadku).

aktualizacja 10/5/2013: aktualizacja Zastanów się umieszczając bower:xxx wewnątrz build:xxx.
W naszym przypadku bower:css wewnątrz build:css i bower:js wewnątrz build:js.
Jest to potrzebne do zminimalizowania działania podczas składania dist. Uważam jednak, że to podejście nie jest tak doskonałe - patrz uwagi poniżej. Jestem trochę zwolniony, ponieważ jest to ten sam sposób, w jaki wersja bootstrap otrzymana przez Yeoman domyślnie jest zawarta w naszej aplikacji: - P
Uwaga: Aby uzyskać pracę z minięciem css, konieczna może być zmiana build:css(.tmp) na build:css({.tmp,app}).
grunt bower-install

Gotowa. Teraz uruchom serwer (grunt server) i Bootstrap 3 będzie dostępny.

Uwagi - Aktualizacja 05.10.2013 - inspirowane @ dochodzenia Luke'a w komentarzu:

oparciu o this dodałem jeden podetap aby dist pracę minifikacji.

Wstrzykiwanie Bowera działa, podobnie jak jego działanie, ale nie jestem tak szczęśliwy z takiego podejścia.
Przyczyny:

[moll] nie używamy już minified środki uzyskane przez altana.
Zminimalizowanie WSZYSTKICH rodzajów CSS/JS do pliku POJEDYNCZEGO jest całkiem kiepskim pomysłem. Lepszym sposobem uwzględnienia zewnętrznych zależności w aplikacji byłoby przełączenie między pobieraniem CDN (dist) i lokalnymi kopiami uzyskanymi za pomocą bower (dev). Coś jak profile z maven.
W zależności od wielkości aplikacji, pobieranie wszystkich zasobów, w szczególności skryptów JavaScript, spowolni pierwsze spotkanie z naszą aplikacją.
Później reszta aplikacji zostanie załadowana szybciej, prawda, ale przy pierwszym wejściu użytkownika na naszą stronę, te obszerne, single-filery będą musiały zostać pobrane z wyprzedzeniem.

@yao tony również nie znalazłem tego podejścia fajnie - zobacz zadane pytanie.

Aktualizacja listopad 2013: Możesz użyć zadania gruntowego cdnify. Fajnie

wersje oprogramowania używałem:

[email protected]:~/somewhere $ yo -v; grunt --version; bower -v 
1.0.4 
grunt-cli v0.1.9 
grunt v0.4.1 
1.2.6

Źródło

2013-09-26 17:15:53 vucalur

To całkowicie mi pomogło. Jedno pytanie jednak: jak to zrobić, aby zamiast tego wprowadzić wersję * .min. {Css | js}? Szczególnie przydatny podczas budowy gruntu. – Luke

Dobry punkt @Luke. Znalazłem obejście, ale nie jestem z tego dumny. Zobacz moją zaktualizowaną odpowiedź. – vucalur

Soooo wiele za to, że altanka staje się łatwiejsza. Wypróbowałem to dzisiaj iw końcu nie miałem odpowiedzi bootstrap3 @ micjamking. – boatcoder

Dla Sass Bootstrap aktualizacji:

Działa to dla mnie:

bower install angular-bootstrap 
bower install sass-bootstrap

i wybierz Nowa wersja s zarówno ...

może należy dodać --save

Uwaga: Sass-bootstrap jest fasola przestarzałe, jest obecnie oficjalnym altana dla wersji Sass z bootstrap https://github.com/twbs/bootstrap-sass ale dont spróbowałem.

Źródło

2014-02-13 13:09:57 Sarabadu

Jak zaktualizować i dodać Twitter Bootstrap 3 na webapp lub yo kanciastą?

Odpowiedz

Powiązane problemy