Questions tagged [webpack-loader]
141 questions
4
votes
1 answer
Get original file path from within Webpack loader
I'm building a custom Webpack loader. What the loader does is unimportant, but it transforms JSON in some way and uses paths from the JSON in order to resolve certain other details. In my loader.js I need a way of getting the original path of the…

shennan
- 10,798
- 5
- 44
- 79
4
votes
1 answer
webpack with express-handlebars
I'm trying to migrate an old express site to webpack, but don't wanna rework all the layout tempaltes which use express-handlebars. Is it possible to use express-handlebars with webpack?
handlebars-loader seems not to support the layout concept of…

catlan
- 25,100
- 8
- 67
- 78
4
votes
2 answers
css-loader returns undefined on importing css file
I have a css file named App.css which has css like
.abcd {
margin-top: 50px !important;
color: red !important;
}
I am importing this and using in my react app like
import styles from './App.css'
console.log("style", styles) // it gives…

varad
- 7,309
- 20
- 60
- 112
4
votes
1 answer
How to add a font to webpack build?
How do you add a font to a webpack project? I can't believe that after looking through a dozen webpack guides I still can't find an actual solution for adding a font. I am not using React, I am using a boilerplate that can be found here:…

Charlie
- 335
- 1
- 5
- 17
3
votes
2 answers
Why does webpack --watch invoke my custom loader on unrelated files?
I have a simple custom Webpack loader which generates TypeScript code from a .txt file:
txt-loader.js
module.exports = function TxtLoader(txt) {
console.log(`TxtLoader invoked on ${this.resourcePath} with content ${JSON.stringify(txt)}`)
if…

Thomas
- 174,939
- 50
- 355
- 478
3
votes
1 answer
Is it possible in Webpack to run my custom Loader whenever I import a fixed string and not a file?
I'm trying to write a Webpack loader that whenever I import a specific fixed string "Hello" like below, it runs my loader at compile time and return a non-cacheable string.
import x from 'Hello';
console.log(x)
The thing here is that "Hello" is…

Shnd
- 1,846
- 19
- 35
3
votes
1 answer
Cannot find module 'gifsicle' for loading image -webpack
I've created a webpack project. In that my project works on my machine, but in all of my teammates laptop who has ubuntu installed on their machine(mine is zorin - a ubuntu based distro), if he uses an image in the project the dev-server throws the…

Jerry_0x04bc
- 41
- 1
- 10
3
votes
1 answer
How to import a variable from django into vue.js instance
I want to import a variable from a django generated html page into my App.vue component.
My goal is to pass a String, which represent the user AuthGroup, eg. 'milkman', 'hairdresser' or 'supplier'
The error Message looks like this:
Module parse…

wittgenstein
- 3,670
- 7
- 24
- 41
3
votes
1 answer
What is the appropriate webpack loader to use static keywords?
I have the following error when I try to start my react-styleguidist documentation:
./node_modules/react-native-gesture-handler/touchables/TouchableHighlight.js 10:22
Module parse failed: Unexpected token (10:22)
You may need an appropriate loader…

Dimitri Kopriwa
- 13,139
- 27
- 98
- 204
3
votes
0 answers
Webpack: reference non-existent file to replace it with loader
Is there a way to transform a file path of a resource in Webpack before Webpack attempts to fetch the resource?
My JS module needs to import standard libraries from node_modules like, for example, Bootstrap's…

spliter
- 12,321
- 4
- 33
- 36
3
votes
1 answer
vue-cli resolve xlink:href in svgs when referenced in ![]()
In my vue-cli project, I need to reference an svg-file in an
-tag. That works.
Now inside this svg file, I have an – And this path is not touched or resolved by webpack.
Example:

katerlouis
- 536
- 6
- 16
3
votes
0 answers
How to concat and bundle JS files using webpack to be loaded in a script tag
I'm struggling to find a "quick" way to transition some legacy javascript files from assetic to webpack. I (think I) need to find a way to bundle a set of javascript files by simply concatenating them and not having webpack wrap it in a jsonp.
Our…

Antony O'Neill
- 113
- 1
- 9
3
votes
1 answer
webpack config for haml
So I've just started using webpack for my projects. I am using webpack to try and compile my haml templates to jsx to react elements. To do this I am using the haml-jsx and babel-loader loaders.
so, the problem I'm having right now arises when…

Leviathan_the_Great
- 429
- 1
- 5
- 14
3
votes
0 answers
Webpack Loader: Default Value for optional dependency
I want to create a webpack loader which can load optional dependencies without a try/catch.
When I'm using it like this
import optional from 'file-exists-loader!./optional-file';`
webpack causes an module not found error. But I want to prevent…

Kaufmo
- 63
- 8
3
votes
0 answers
Ignore certain .js files with webpack dev server running --hot
I have the need to import some javascript files as pure text with webpack.
All the files have a specific extension say: .mytype.js.
I have created a loader for these files using:
module.loaders = [{
test: /\.mytype.js?$/,
exclude:…

Joe
- 1,455
- 2
- 19
- 36