Bootstrap & LESS: clean "reference" import

Ho letto @import (reference) e ho provato ad importare bootstrap senza aggiungere chunk in css.Bootstrap & LESS: clean "reference" import

ho pensato che il file css esportato sarebbe vuota se il mio file MENO aveva solo una singola linea:

@import (reference) "bootstrap";

ma export.css ha alcune linee:

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; 
}

Allora perché? Sono qui per una ragione?

Sto usando Meno 1.7.0 e Bootstrap 3.1.1.

fonte

2014-04-17 gfaceless

Questo è noto problema di implementazione "di riferimento" ha problemi con certi schemi di nidificazione/autoreferenziali Lei.. può ottenere risultati più puliti importando il CSS di bootstrap compilato e i singoli componenti di mixin (se necessario), ad es .: '@import (less, reference)" .../bootstrap.css "; @import" .../mixins.less ";' ecc. –

@ seven-fasi-max grazie, che aiuta davvero. – gfaceless

@ seven-phases-max Esiste un collegamento al problema di riferimento di importazione? Voglio saperne di più. – xeepete

Questo è dovuto al fatto che :extend all'interno dei file Bootstrap. È possibile utilizzare questo (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";

Ma questo è ridicolo :(

fonte

2015-11-26 15:25:55

Bootstrap & LESS: clean "reference" import

risposta

Problemi correlati