shakacode / bootstrap-loader

Load Bootstrap styles and scripts in your Webpack bundle
MIT License
1.02k stars 486 forks source link

Postcss not applied to bootstrapCustomizations #278

Closed timworx closed 2 years ago

timworx commented 7 years ago

It appears that postcss is not being applied to bootstrapCustomizations - I would argue that it really should be.

For example, when using the "materia" theme from Bootswatch input elements have an appearance: none; This should wind up prefixed (and does in the code elsewhere in my app).

My .bootstraprc looks like this:

---
# Output debugging info
# loglevel: debug

# Major version of Bootstrap: 3 or 4
bootstrapVersion: 4

# If Bootstrap version 4 is used - turn on/off flexbox model
useFlexbox: true

# Webpack loaders, order matters
styleLoaders:
  - style-loader
  - css-loader
  - postcss-loader
  - sass-loader

# Extract styles to stand-alone css file
# Different settings for different environments can be used,
# It depends on value of NODE_ENV environment variable
# This param can also be set in webpack config:
#   entry: 'bootstrap-loader/extractStyles'
extractStyles: false
# env:
#   development:
#     extractStyles: false
#   production:
#     extractStyles: true

# Customize Bootstrap variables that get imported before the original Bootstrap variables.
# Thus original Bootstrap variables can depend on values from here. All the bootstrap
# variables are configured with !default, and thus, if you define the variable here, then
# that value is used, rather than the default. However, many bootstrap variables are derived
# from other bootstrap variables, and thus, you want to set this up before we load the
# official bootstrap versions.
# For example, _variables.scss contains:
# $input-color: $gray !default;
# This means you can define $input-color before we load _variables.scss

preBootstrapCustomizations: ./src/styles/_bs-variables.scss

# This gets loaded after bootstrap/variables is loaded and before bootstrap is loaded.
# A good example of this is when you want to override a bootstrap variable to be based
# on the default value of bootstrap. This is pretty specialized case. Thus, you normally
# just override bootrap variables in preBootstrapCustomizations so that derived
# variables will use your definition.
#
# For example, in _variables.scss:
# $input-height: (($font-size-base * $line-height) + ($input-padding-y * 2) + ($border-width * 2)) !default;
# This means that you could define this yourself in preBootstrapCustomizations. Or you can do
# this in bootstrapCustomizations to make the input height 10% bigger than the default calculation.
# Thus you can leverage the default calculations.
# $input-height: $input-height * 1.10;

bootstrapCustomizations: ./src/styles/bs-theme.scss

# 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

### Bootstrap styles
styles:

  # Mixins
  mixins: true

  # Reset and dependencies
  normalize: true
  print: true

  # Core CSS
  reboot: true
  type: true
  images: true
  code: true
  grid: true
  tables: true
  forms: true
  buttons: true

  # Components
  transitions: true
  dropdown: true
  button-group: true
  input-group: true
  custom-forms: true
  nav: true
  navbar: true
  card: true
  breadcrumb: true
  pagination: true
  jumbotron: true
  alert: true
  progress: true
  media: true
  list-group: true
  responsive-embed: true
  close: true
  badge: false

  # Components w/ JavaScript
  modal: true
  tooltip: true
  popover: true
  carousel: true

  # Utility classes
  utilities: true

### Bootstrap scripts
scripts:
  alert: true
  button: true
  carousel: true
  collapse: true
  dropdown: true
  modal: true
  popover: true
  scrollspy: true
  tab: true
  tooltip: true
  util: true
justin808 commented 7 years ago

@timworx Any chance that you can help us debug this?

timworx commented 7 years ago

I'll do whatever I can to help. Any tips on what would be helpful for debugging?

justin808 commented 7 years ago

@timworx See https://github.com/shakacode/bootstrap-loader/blob/master/CONTRIBUTING.md and use lots of print statements!

justin808 commented 7 years ago

@timworx what happened with this issue? Any doc PR needed?