$icon-font-path is not relative to my Sass file

[denizdogan]

When I try to set $icon-font-path in my file _bootstrap-pre.scss, it seems that it's relative to ~/node_modules/bootstrap-loader where ~ is my project root. The documentation says it should be relative to my Sass file, which would make more sense.

Am I missing something?

This is my .bootstraprc:

---
# Output debugging info
loglevel: warn

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

# If Bootstrap version 3 is used - turn on/off custom icon font path
useCustomIconFontPath: true

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

# 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: ./assets/_bootstrap-pre.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: ./assets/_bootstrap-post.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: ./assets/letro.scss

### Bootstrap styles
styles:

  # Mixins
  mixins: true

  # Reset and dependencies
  normalize: true
  print: true
  glyphicons: true

  # Core CSS
  scaffolding: true
  type: true
  code: false
  grid: true
  tables: true
  forms: true
  buttons: true

  # Components
  component-animations: true
  dropdowns: true
  button-groups: false
  input-groups: false
  navs: true
  navbar: true
  breadcrumbs: true
  pagination: false
  pager: false
  labels: false
  badges: false
  jumbotron: false
  thumbnails: true
  alerts: true
  progress-bars: false
  media: true
  list-group: true
  panels: true
  wells: false
  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: false
  button: false
  carousel: true
  collapse: false
  dropdown: true
  modal: true
  tooltip: true
  popover: true
  scrollspy: false
  tab: true
  affix: true

[justin808]

Possibly this will help: https://github.com/shakacode/sass-resources-loader/issues/9

Also, are you using relative paths in your .bootstraprc file?

[justin808]

@denizdogan Can we close this one?

[denizdogan]

@justin808 Sorry, not sure what to do with the link to that issue. I am using relative paths in .bootstraprc.

[justin808]

@denizdogan Can you create a small sample project that shows the issue?

[Judahmeek]

@denizdogan I think @justin808 was implying that you could use https://github.com/bholloway/resolve-url-loader (which he indirectly linked to), by having resolve-url-loader set the paths in your bootstrap-pre.scss file relative to the source file (in a way that webpack likes), which should resolve your issue.

[denizdogan]

Thanks for your help, I'll get back to this issue soon enough, bear with me

[Judahmeek]

@denizdogan Are you using bootstrap-loader v1 or v2?

[denizdogan]

@Judahmeek I still don't have access to the code I used for this issue, but if it's any help, I believe I did npm install bootstrap-loader on the same day that I created this issue! Again, sorry for the delay, I will get back to this issue once I get access to the code again.

[denizdogan]

No longer relevant to me, closing