css loader module for webpack
Questions tagged [css-loader]
450 questions
10
votes
0 answers
Webpack not building because CssSyntaxError
I am trying to run a webpack-dev-server built, but it fails everytime with the following error:
ERROR in ./src/style.css…
Nairu
- 101
- 4
10
votes
2 answers
Webpack 4: css-loader + file-loader to add fonts and their stylesheets in the build process
Given this setup:
fonts/styles.css
@font-face {
family: 'MyFont';
src: url('fonts/myfont.otf');
}
How can I:
in my JS bundle, obtain a reference to the URL of the CSS file, as a string, e.g. [name].[hash].css
the generated CSS file should be a…
Dan Burzo
- 9,145
- 18
- 44
- 67
10
votes
2 answers
Relative CSS urls in Webpack
Webpack + file-loader + sass-loader is having trouble resolving relative paths for CSS background images.
The compiled SCSS file contains a path to the background image that is relative to /dist/ instead of relative to the SCSS/CSS document. I…
Jason
- 3,919
- 4
- 19
- 30
10
votes
2 answers
webpack Can't resolve 'style'
I was trying to follow the simple Getting Started from (http://webpack.github.io/docs/tutorials/getting-started/).
And I am getting this error when I try to load style.css.
ERROR in ./entry.js
Module not found: Error: Can't resolve 'style' in 'Path…
Ravi
- 273
- 1
- 4
- 16
10
votes
2 answers
Can i have a single variables file using cssnext with webpack?
I've got a project which has a set of css files (one for each react component). I'm using the css-loader (with modules on) in webpack and also postcss-cssnext.
Ideally i want a single variables.css so i can share variables across the css files. I've…
Michael Willmott
- 529
- 1
- 8
- 21
9
votes
1 answer
Unable to inline styles with `sass-loader`
I have a project setup where I use ExtractTextPlugin to create a CSS file. I'm trying to create a dev Webpack config with the styles injected onto the page using style-loader, css-loader, and sass-loader.
As far as I am aware the default behaviour…
JmJ
- 1,548
- 2
- 21
- 41
9
votes
2 answers
How to let CSS Modules import files globally by default?
I am trying to implement CSS modules to my project which is using React and Webpack. But, I want to keep using all the global css that I have created.
For example, previously I imported css in React like this
import './styles.scss'
And then, there…
Adriel
- 111
- 1
- 6
9
votes
3 answers
How to exclude bootstrap files when CSS modules is enabled
I am using both bootstrap and CSS modules by enabling the css-loader's modules option in my project and unfortunately css-loader applys scoping on the bootstrap files too.
I have an app.scss where I am importing all bootstrap sass files. And I…
bigfanjs
- 577
- 5
- 16
9
votes
1 answer
Css Loader vs Style Loader Vs Sass-Loader
I was little confused in differentiating sass-loader and css-loader while using import statement. As per my knowledge css loader resolve import statment(@import) and style-loader works on injecting style dynamically on your page. I am also using…
Bharat Sewani
- 418
- 2
- 7
- 16
9
votes
1 answer
How to debug CSS bundled by Webpack?
I've switched from including stylesheets the oldschool way:
to Webpack approach:
var css = require('./../css/main.css');
It works, but I don't like that it extracts the css from this file into…
van_folmert
- 3,330
- 5
- 33
- 74
8
votes
1 answer
Use [hash:base64:5] in JavaScript / TypeScript file
I am using CSS Modules in an Angular Project with Webpack.
I had already transformed the class names in .css and .scss files with postcss-modules.
Then with posthtml-css-modules I had changed the values on the class property in html elements for his…
German Quinteros
- 1,546
- 7
- 25
8
votes
1 answer
Webpack You may need an appropriate loader to handle this file type, with sue
I created my project with Webpack and using Vue.js in development, but I can't inject