Bootstrap i LESS: czysty "referencyjny" import

Przeczytałem @import (reference) i próbowałem zaimportować bootstrap bez dodawania porcji css.Bootstrap i LESS: czysty "referencyjny" import

Myślałem wyeksportowany plik css będzie pusta, jeśli mój MNIEJ plik miał tylko jedną pojedynczą linię:

@import (reference) "bootstrap";

export.css ale ma pewne linie:

d.thumbnail > img, ... 
.carousel-inner > .item > a > img { 
    display: block; 
    max-width: 100%; 
    height: auto; 
} 
.btn-group-lg > .btn {...} 
.btn-group-sm > .btn {...} 
.btn-group-xs > .btn {...} 
.container:before, ... 
.modal-footer:after { 
    content: " "; 
    display: table; 
} 
.container:after, ... 
.modal-footer:after { 
    clear: both; 
}

Więc dlaczego? Czy są tutaj z jakiegoś powodu?

Używam less 1.7.0 i Bootstrap 3.1.1.

Źródło

2014-04-17 gfaceless

ten jest znany problem "Reference" realizacja ma problemy z niektórymi lęgowych/self-odwołanie wzorców You.. można osiągnąć bardziej czysty wynik poprzez zaimportowanie skompilowanego pliku CSS startowego i poszczególnych komponentów mixin (jeśli to konieczne), np .: '@import (less, reference)" .../bootstrap.css "; @import" .../mixins.less ";' itp. –

@ seven-phase-max dziękuję, to naprawdę pomaga – gfaceless

@ seven-phase-max Czy istnieje link do numeru referencyjnego importu? Chcę przeczytać więcej na ten temat. – xeepete

Dzieje się tak, ponieważ :extend wewnątrz plików Bootstrap. Można użyć tego (v.3.xx):

// Core variables and mixins 
@import "bootstrap/variables.less"; 
@import (reference) "bootstrap/mixins.less"; 

// Reset and dependencies 
// @import "bootstrap/normalize.less"; 
// @import (reference) "bootstrap/print.less"; 
// @import (reference) "bootstrap/glyphicons.less"; 

// Core CSS 
@import (reference) "bootstrap/scaffolding.less"; 
// @import (reference) "bootstrap/type.less"; 
@import (reference) "bootstrap/code.less"; 
// @import (reference) "bootstrap/grid.less"; 
@import (reference) "bootstrap/tables.less"; 
// @import (reference) "bootstrap/forms.less"; 
@import (reference) "bootstrap/buttons.less"; 

// Components 
@import (reference) "bootstrap/component-animations.less"; 
@import (reference) "bootstrap/dropdowns.less"; 
// @import (reference) "bootstrap/button-groups.less"; 
// @import (reference) "bootstrap/input-groups.less"; 
// @import (reference) "bootstrap/navs.less"; 
// @import (reference) "bootstrap/navbar.less"; 
@import (reference) "bootstrap/breadcrumbs.less"; 
@import (reference) "bootstrap/pagination.less"; 
// @import (reference) "bootstrap/pager.less"; 
@import (reference) "bootstrap/labels.less"; 
@import (reference) "bootstrap/badges.less"; 
@import (reference) "bootstrap/jumbotron.less"; 
// @import (reference) "bootstrap/thumbnails.less"; 
@import (reference) "bootstrap/alerts.less"; 
@import (reference) "bootstrap/progress-bars.less"; 
@import (reference) "bootstrap/media.less"; 
@import (reference) "bootstrap/list-group.less"; 
// @import (reference) "bootstrap/panels.less"; 
@import (reference) "bootstrap/responsive-embed.less"; 
@import (reference) "bootstrap/wells.less"; 
@import (reference) "bootstrap/close.less"; 

// Components w/ JavaScript 
// @import (reference) "bootstrap/modals.less"; 
@import (reference) "bootstrap/tooltip.less"; 
@import (reference) "bootstrap/popovers.less"; 
// @import (reference) "bootstrap/carousel.less"; 

// Utility classes 
@import (reference) "bootstrap/utilities.less"; 
@import (reference) "bootstrap/responsive-utilities.less";

Ale to jest śmieszne :(

Źródło

2015-11-26 15:25:55

Bootstrap i LESS: czysty "referencyjny" import

Odpowiedz

Powiązane problemy