CODEWITHSUNDEEP
webpackwebpack-dev-server
Calvin Froedge
Calvin Froedge

Reputation: 16373

Rewriting URLs in webpack

I'm using webpack to bundle files and import CSS. Inside a CSS file included from bootstrap, there is a font reference to /fonts/glyphicons-halflings-regular.ttf.

Is there any way to instruct webpack to mount files from /node_modules/bootstrap-css-only/fonts/ to /fonts? Or to rewrite the HTTP request through webpack dev server based on a regex expression?

Sorry if this is super basic, new to webpack.

Upvotes: 8

Views: 3401

Answers (1)

Oleksii
Oleksii

Reputation: 233

You can use file loader and adjust [path] variable:

loaders: [ 
    {
      test:   /\.(png|jpg|svg|ttf|eot|woff|woff2)$/,
      loader: 'file?name=[path][name].[ext]' // your case: 'file?name=fonts/[name].[ext]'
    }
...
],

In this case, all the matched files will be placed into the "fonts/" folder.

Upvotes: 3

Related Questions