Webpack boot boot file loads user file after boot

Question

I use webpack to bootstrap-sass using this bootstrap-loader plugin

I tried to add my custom .scss file and in .bootstraprc I setup as follows:

bootstrapVersion: 3 styleLoaders: - style - css - sass appStyles: ./src/sass/main.scss styles: # Mixins mixins: true # Reset and dependencies normalize: true print: true glyphicons: true # Core CSS scaffolding: true type: true code: true grid: true tables: true forms: true buttons: true # Components component-animations: true dropdowns: true button-groups: true input-groups: true navs: true navbar: true breadcrumbs: true pagination: true pager: true labels: true badges: true jumbotron: true thumbnails: true alerts: true progress-bars: true media: true list-group: true panels: true wells: true responsive-embed: true close: true # Components w/ JavaScript modals: true tooltip: true popovers: true carousel: true # Utility classes utilities: true responsive-utilities: true ### Bootstrap scripts scripts: transition: true alert: true button: true carousel: true collapse: true dropdown: true modal: true tooltip: true popover: true scrollspy: true tab: true affix: true 

The problem is that when I create the file, my custom css uploads the file before uploading.

My main.scss:

 @import '~animate.css/animate.min.css'; $color: blue; body{ color:$color; } 

When I restart body{} appears after loading. but import the file before downloading.

Suppose this is so, or am I mistaken?

Answer 1

In .bootstraprc there is an option to add additional styles to bootstrap.

 # Import your custom styles here. You have access to all the bootstrap variables. If you require # your sass files separately, you will not have access to the bootstrap variables, mixins, clases, etc. # Usually this endpoint-file contains list of @imports of your application styles. appStyles: ./app/styles/app.scss