css loader module for webpack
Questions tagged [css-loader]
516 questions
15
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
- 4,079
- 4
- 22
- 32
14
votes
2 answers
webpack fails "module build failed: unknown word" with webpack.config.js file
webpack does not work for me when trying to add css using the css-loader.
os: Windows 10 pro,
webpack: 4.8.0
node: 8.9.4
npm: 6.0.0
css-loader: 0.28.11
style-loader: 0.21.0
package.json
{
"name": "webpack-dev",
"version": "1.0.0",
…
rochin
- 141
- 1
- 1
- 5
13
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
- 9,912
- 18
- 49
- 70
12
votes
4 answers
How to hash CSS class names in Nextjs?
How can I edit localIdentName field of css-loader in Webpack configuration in Nextjs so that I can hash/hide/obfuscate css class names?
The example below is from the New York Times. Note the class names:
user9408899
- 4,202
- 3
- 19
- 32
12
votes
1 answer
Using css modules with Extract Text Plugin
Webpack 2 build doesn't work as expected in production mode using css modules option in css-loader with extract-text-webpack-plugin.
the correct generated classes are created on html elements, implying that css-loader is working as intended, but the…
deckele
- 4,623
- 1
- 19
- 25
12
votes
6 answers
cannot find module css-loader while doing ng build -prod with angular-cli@1.0.0-beta.21
I have following package.json configuration
"dependencies": {
"@angular/common": "2.2.1",
"@angular/compiler": "2.2.1",
"@angular/core": "2.2.1",
"@angular/forms": "2.2.1",
"@angular/http": "2.2.1",
"@angular/platform-browser":…
Gan
- 937
- 8
- 22
11
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
- 128
- 2
- 8
10
votes
3 answers
How can I set a CSS name not to be a hash in a Webpack configuration file?
I just wondering why my CSS name became hash after I build and run my React + Webpack application. Is there advance configuration that I may have missed to set the CSS name as normal?
This is my Webpack configuration:
var webpack =…
Rido
- 717
- 4
- 10
- 23
10
votes
2 answers
webpack not generating css file
Implementing webpack asset management tutorial .but webpack is not generating css file in output path
webpack.config.js
const config = {
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: __dirname + '/build'
},
module:…
vijay
- 10,276
- 11
- 64
- 79
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
- 323
- 2
- 6
- 18
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
Webpack CSS Output Is Always Minified
For my specific project, I need to control the minification of my CSS and only minify certain files. I am very close to a working solution using OptimizeCSSAssetsPlugin where I use the assetNameRegExp option to choose the CSS files I want to…
lukehillonline
- 2,430
- 2
- 32
- 48
9
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