Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

less-loader should rewrite url(...) in less files #8

Closed
andreypopp opened this issue Apr 10, 2014 · 14 comments
Closed

less-loader should rewrite url(...) in less files #8

andreypopp opened this issue Apr 10, 2014 · 14 comments

Comments

@andreypopp
Copy link

Right now when trying to load bootstrap it fails because it tries to resolve url(...) extracted from already rendered CSS, of course url(...) are incorrect because they are relative to original filenames.

A simple fix:

if (/url\(/.exec(data)) {
  data = data.replace(/url\(([^\)]+)\)/g, function(_, url) {
    url = url.replace(/^(\\"|"|'|\\')/, '').replace(/(\\"|"|'|\\')$/, '');
    url = 'url(' + path.dirname(filename) + '/' + url + ')';
    return url;
  });
}

seems to work, but I've found that we can apply another patch to less compiler for a "cleaner" way to do that.

@sokra
Copy link
Member

sokra commented Apr 11, 2014

Can you bring in an example? Theoretically this should work.

@jhnns
Copy link
Member

jhnns commented Apr 11, 2014

Should be fixed with ad8adde

Maybe yours is a special case?

@andreypopp
Copy link
Author

That's the example:
https://gist.github.com/andreypopp/954f2944e75ca24ffc06
That's the webpack output:

Hash: 23398e3e577853050409
Version: webpack 1.1.5
Time: 1337ms
    Asset    Size  Chunks             Chunk Names
bundle.js  131057       0  [emitted]  main       
   [0] ./index.js 25 {0} [built]
   [1] ./index.less 470 {0} [built]
       cjs require ./index.less [0] ./index.js 1:0-23
   [2] (webpack)/~/css-loader!(webpack)/~/less-loader!./index.less 127879 {0} [built] [4 errors]
       cjs require !!/Users/andreypopp/Workspace/webpack/node_modules/css-loader/index.js!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/index.js!/Users/andreypopp/Workspace/webpack/examples/less/index.less [1] ./index.less 4:2-214
   [3] (webpack)/~/style-loader/addStyle.js 715 {0} [built]
       cjs require !/Users/andreypopp/Workspace/webpack/node_modules/style-loader/addStyle.js [1] ./index.less 2:14-99
   [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less 1198 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/bootstrap.less [2] (webpack)/~/css-loader!(webpack)/~/less-loader!./index.less
   [5] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/variables.less 26235 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/variables.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
   [6] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/mixins.less 27537 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/mixins.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
   [7] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/normalize.less 7878 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/normalize.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
   [8] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/print.less 1730 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/print.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
   [9] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/scaffolding.less 2404 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/scaffolding.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [10] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/type.less 6035 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/type.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [11] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/code.less 1394 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/code.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [12] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/grid.less 1473 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/grid.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [13] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/tables.less 4709 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/tables.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [14] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/forms.less 11531 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/forms.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [15] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/buttons.less 3706 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/buttons.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [16] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/component-animations.less 540 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/component-animations.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [17] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/glyphicons.less 15726 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/glyphicons.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [18] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/dropdowns.less 4864 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/dropdowns.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [19] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/button-groups.less 5252 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/button-groups.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [20] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/input-groups.less 4383 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/input-groups.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [21] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/navs.less 5170 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/navs.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [22] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/navbar.less 14554 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/navbar.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [23] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/breadcrumbs.less 625 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/breadcrumbs.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [24] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/pagination.less 2086 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/pagination.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [25] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/pager.less 914 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/pager.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [26] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/labels.less 1150 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/labels.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [27] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/badges.less 1114 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/badges.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [28] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/jumbotron.less 947 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/jumbotron.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [29] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/thumbnails.less 788 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/thumbnails.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [30] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/alerts.less 1499 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/alerts.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [31] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/progress-bars.less 1671 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/progress-bars.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [32] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/media.less 906 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/media.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [33] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/list-group.less 2731 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/list-group.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [34] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/panels.less 5791 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/panels.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [35] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/wells.less 558 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/wells.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [36] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/close.less 720 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/close.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [37] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/modals.less 3549 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/modals.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [38] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/tooltip.less 2687 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/tooltip.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [39] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/popovers.less 3505 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/popovers.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [40] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/carousel.less 4835 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/carousel.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [41] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/utilities.less 838 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/utilities.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less
  [42] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/responsive-utilities.less 2099 [built]
       loader -!/Users/andreypopp/Workspace/webpack/node_modules/less-loader/stringify.loader.js!/Users/andreypopp/Workspace/webpack/node_modules/bootstrap/less/responsive-utilities.less [4] (webpack)/~/less-loader/stringify.loader.js!(webpack)/~/bootstrap/less/bootstrap.less

ERROR in (webpack)/~/css-loader!(webpack)/~/less-loader!./index.less
Module not found: Error: Cannot resolve file or directory ../fonts/glyphicons-halflings-regular.eot in /Users/andreypopp/Workspace/webpack/examples/less
resolve file
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.eot doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.eot.webpack.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.eot.web.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.eot.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.eot.json doesn't exist
resolve directory
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.eot doesn't exist (directory default file)
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.eot/package.json doesn't exist (directory description file)
 @ (webpack)/~/css-loader!(webpack)/~/less-loader!./index.less 2:47401-47453 2:47472-47524

ERROR in (webpack)/~/css-loader!(webpack)/~/less-loader!./index.less
Module not found: Error: Cannot resolve file or directory ../fonts/glyphicons-halflings-regular.woff in /Users/andreypopp/Workspace/webpack/examples/less
resolve file
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.woff doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.woff.webpack.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.woff.web.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.woff.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.woff.json doesn't exist
resolve directory
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.woff doesn't exist (directory default file)
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.woff/package.json doesn't exist (directory description file)
 @ (webpack)/~/css-loader!(webpack)/~/less-loader!./index.less 2:47570-47623

ERROR in (webpack)/~/css-loader!(webpack)/~/less-loader!./index.less
Module not found: Error: Cannot resolve file or directory ../fonts/glyphicons-halflings-regular.ttf in /Users/andreypopp/Workspace/webpack/examples/less
resolve file
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.ttf doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.ttf.webpack.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.ttf.web.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.ttf.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.ttf.json doesn't exist
resolve directory
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.ttf doesn't exist (directory default file)
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.ttf/package.json doesn't exist (directory description file)
 @ (webpack)/~/css-loader!(webpack)/~/less-loader!./index.less 2:47649-47701

ERROR in (webpack)/~/css-loader!(webpack)/~/less-loader!./index.less
Module not found: Error: Cannot resolve file or directory ../fonts/glyphicons-halflings-regular.svg in /Users/andreypopp/Workspace/webpack/examples/less
resolve file
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.svg doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.svg.webpack.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.svg.web.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.svg.js doesn't exist
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.svg.json doesn't exist
resolve directory
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.svg doesn't exist (directory default file)
  /Users/andreypopp/Workspace/webpack/examples/fonts/glyphicons-halflings-regular.svg/package.json doesn't exist (directory description file)
 @ (webpack)/~/css-loader!(webpack)/~/less-loader!./index.less 2:47731-47783

@andreypopp
Copy link
Author

As you can see webpack can't find glyphicons icon font because it tries to resolve it against a directory in which the index.less (less entry point) resides. This is why we need to rewrite url(...) before we render with less (or during).

@jhnns
Copy link
Member

jhnns commented Apr 11, 2014

Well, as @sokra pointed out, theoretically they should be rewritten. We just need to find out, why this isn't the case. 😉

@jhnns
Copy link
Member

jhnns commented Apr 11, 2014

Well, I made several tests proving that rewriting urls works as intended. However, I've spotted that less has an issue with dynamic url() (which bootstrap is using).

In your case you can simply override the variable to change the path. Of course, that's just a quickfix but I think this needs to be fixed by less.

@sokra
Copy link
Member

sokra commented Apr 11, 2014

twbs/bootstrap#10941

@andreypopp
Copy link
Author

@jhnns not sure how I can set variable because I don't know where bootstrap package is (node_modules? global node_modules?).

@andreypopp
Copy link
Author

ok, I can just use ~bootstrap/fonts.

@jhnns
Copy link
Member

jhnns commented Apr 13, 2014

Just set @icon-font-path to the correct path inside of your less folders. You can override less variables anywhere, it even doesn't need to happen before the import.

@luisrudge
Copy link

Can you guys help me fix this? I'm having the same problem.
Here's my code:

//my-app.less
@icon-font-path: '../node_modules/bootstrap/fonts/';
@import '../node_modules/bootstrap/less/bootstrap.less';
@import 'bootstrap-overrides.less';

@luisrudge
Copy link

Ok, I had to at this configs to the module object:

module: {
  loaders: [
/* other loaders */
{
    test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,
    loader: "url?limit=10000&minetype=application/font-woff"
  }, {
    test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/,
    loader: "url?limit=10000&minetype=application/font-woff"
  }, {
    test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
    loader: "url?limit=10000&minetype=application/octet-stream"
  }, {
    test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
    loader: "file"
  }, {
    test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
    loader: "url?limit=10000&minetype=image/svg+xml"
  }]
}

@jhnns
Copy link
Member

jhnns commented May 20, 2015

I think I should be spelled mimetype 😀

@luisrudge
Copy link

Yeah. Sorry for the typo

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants