Stack Overflow
Stack Overflow

Questions tagged [webpack-file-loader]

Hadles such imports

import img from './file.png'

with this configuration

  rules: [
  {
    test: /\.(gif|jpg|png)$/,
    use: [
      {
        loader: 'file-loader'
      }
    ]
  }

and result: image files were copied to output folder.

Other application: copy css styles to the output folder adding the hash.

https://github.com/webpack-contrib/file-loader

289 questions
0
votes
1 answer

Webpack file loader manipulate output path

Let's say I have a simple loader, that's supposed to just move a file from source to deploy, i've just copied the rule alone for simplistic state. { test: /\.cshtml$/, use : [{ loader : 'file-loader', options : { …
Shannon Hochkins
  • 11,763
  • 15
  • 62
  • 95
0
votes
1 answer

Issue with building React app using Jenkins, some files missing because of file-loader

I'm building a react app using Jenkins, and the build succeeds. However, some components fail to load and I get an error: Uncaught Error: Cannot find module './sun.png' Local, everything works fine. the app structure…
Chen
  • 2,958
  • 5
  • 26
  • 45
0
votes
1 answer

Webpack - File Loader - Parent Directory + Different Served Path

Good evening, Given an image/font file located at assets/images/myimg.png (or assets/fonts/myfont.woff)..... I want webpack's file-loader to create a hashed version in a different directory (../priv/static/fonts/myfont.woff)... But I don't want that…
Brandon
  • 3,091
  • 2
  • 34
  • 64
0
votes
1 answer

Need help fixing webpack.config with relative/absolute paths

I am trying to make my webpack.config work with images in subfolders. And I am having troubles with it. I spent the last day and a half scouring the internet and reading various solutions to no avail. My src files…
Pic Mickael
  • 1,244
  • 19
  • 36
0
votes
0 answers

When image link is passed into a component, I get 'Unexpected character' error (Webpack, Babel)

In my React app I can import images fine everywhere, apart from one place where I try and pass in an image path to a component. const Component = ({ imgLink }) => { const img = imgLink ? (whatever) : '' return (
…
MDalt
  • 1,681
  • 2
  • 24
  • 46
0
votes
3 answers

file-loader for webpack is not moving the src folder image files to dist folder

{ test: /\.(png|jpg|gif)$/, loader: 'file-loader?name=img/img-[hash:6].[ext]', }, I added this config intowebpack.config.js to utilize file-loader by add above rule into module: { rules: [ section, but none of the image…
ey dee ey em
  • 7,991
  • 14
  • 65
  • 121
0
votes
2 answers

how to config the url-loader in webpack to transform only some folders?

webpack.js file.jpg: transform to base64 by url-loader file.png: use file-loader just use the ext to decide all file.jpg in project to transform。 but how to deal the file.gif? indeed I want to know how to config the url-loader in webpack to…
daidaibenben
  • 33
  • 1
  • 6
0
votes
1 answer

file name using hash to avoid the cache

[name].[ext]?[hash] I have two questions about the expression: how could this help for avoid cache in the browser? actually in Windows OS,it will emmit a file that named as [name].[ext],without the ?[hash] portion.So,it is not a good solution?
zzzgoo
  • 1,974
  • 2
  • 17
  • 34
0
votes
1 answer

Webpack 2 - file-loader [path] options

Im using webpacks file-loader to output a bunch of compiled html files from a folder of pug templates. I want to put the html files in the output directory, into the same folder structure they were in when they were in the source /pug/ folder, minus…
Matthew
  • 952
  • 7
  • 20
0
votes
1 answer

Minification/Optimization of the files required using webpack file-loader

When I do require('./something.html') in my code and configure file-loader to load html files something like this: ... module: { rules: [ {test: /\.html$/, loader: 'file-loader', options: {name: '[name].[hash].html'} …
kabirbaidhya
  • 3,264
  • 3
  • 34
  • 59
0
votes
1 answer

Can't load fonts with file-loader and webpack v2

I'm having trouble loading fonts with webpack v2 and file-loader. Using url-loader for any font-files everything works perfectly. However, I want to use file-loader so we can cache font files rather than storing all images and fonts in the bundled…
jasonleibowitz
  • 180
  • 9
0
votes
1 answer

Webpack file-loader : rewrite the path

How to change the output directory of file copied with file-loader ? Configuration : var SRC_DIR = path.resolve(__dirname, 'src'); ... loaders : [ { test : /\.html$/, include : SRC_DIR + "/main/html", loader :…
user2668735
  • 1,048
  • 2
  • 18
  • 30
0
votes
1 answer

Assets only correctly map up when my application isn't hosted on a pre-existing path

I'm developing an application for use on multiple client sites. These are hosted either as a subdomain or as a path (which I have no control over), like…
James Donnelly
  • 126,410
  • 34
  • 208
  • 218
0
votes
1 answer

Load assets from jQuery UI in webpack using file loader

I want to have jQuery ui assets in folder /dist/ and they should be loaded from an app. I have this in my webpack config: module.exports = { context: path.resolve(__dirname, "app"), output: { path: __dirname + '/dist', …
jcubic
  • 61,973
  • 54
  • 229
  • 402
0
votes
1 answer

Loading dynamic image in webpack

I am using Angular with Webpack (with loaders like file-loader, url-loader etc.) Now, I want to load image which is being served through http. The build was successful, when I used require('./imgs/profile.png') But when I used tried say E.g.…
Ashwin Hegde
  • 1,733
  • 4
  • 19
  • 49
1 2 3
…
19
20