Comments (12)
Try removing sourceMap param from css loader @luqin
from url-loader.
@bengrunfeld I will test it and take a deeper look soon 😛 things a saw at first glance are
.babelrc
- ['env', 'es2015', 'react']
+ ['env', 'react']
babel-preset-env
'includes' babel-preset-es2015
already you applying it twice atm, check the README :)
For the URL issue, since you're are using sass-loader
you may need resolve-url-loader
, but as I said I will come back here later 🙃
from url-loader.
All good here! Removing sourceMaps
did the trick.
from url-loader.
FWIW I had to debug the same problem and I posted my findings on StackOverflow: http://stackoverflow.com/questions/34133808/webpack-ots-parsing-error-loading-fonts/34133809#34133809
Chrome has problems with paths that don't specify the protocol
from url-loader.
The same problem +1
from url-loader.
Though I was trying to get base64 strings to render properly (and couldn't), this at least led me to the absolute URL solution. I don't love it, but it's literally the only thing I've gotten to work, so thank you @wmadden.
from url-loader.
@EugeneHlushko Thank you!
from url-loader.
@brandondurham You still experience this regression ?
from url-loader.
@EugeneHlushko can you please show code, or give explanation of how to remove the sourceMap
param from the CSS (or SASS) loader?
e.g. if these are your loaders in webpack.config.js
, where would you change the code?
{
test: /\.(png|jpg)$/,
loader: 'url-loader?limit=20000'
},
{
test: /\.scss$/,
loader: 'style-loader!css-loader!sass-loader'
}
from url-loader.
@bengrunfeld With the webpack.config.js
you posted sourceMap
should be off already, what is your particular issue ? Please provide more info about your setup (webpack version, loader versions, webpack.config.js
) and logs (stacktrace) etc.
from url-loader.
@michael-ciniawsky Here is a link to a repo with an example of the bug. link
Clone, npm install
and run webpack
and if you open index.html
in Chrome, you will see the following error in the developer console: Failed to load resource: net::ERR_FILE_NOT_FOUND
, but if you inspect the offending element <div class="lisa"></div>
you will see that a direct URL has been created for this resource, although it does not resolve to an actual image.
Again, maybe this is a usage error, but hard to tell from my perspective since I am receiving no Webpack errors.
from url-loader.
Any update on this? I don't have source-maps enabled. The one difference from the OP's is that my css is inside "<style>" tags instead of a separate css file
from url-loader.
Related Issues (20)
- Specifying options as a query string does not work anymore
- Regarding the conversion of files to data urls, a less than condition was found to be missing HOT 1
- Corrupted or not proceed image matched multiple module rule simultaneously HOT 2
- How can i use name function with url-loader? HOT 1
- Limit option does not support 'Infinity' or 'Max Value' HOT 2
- Multiple references to the same asset in SASS/CSS `url()` breaks replacement process HOT 4
- [email protected] requires a peer of webpack@^4.0.0 but [email protected] was installed HOT 2
- Allow expressing limit as a function HOT 2
- `esModules: true` outputs `url([object Module])` instead of `url(base64String)` for inline local fonts? HOT 22
- Why url-loader stop supporting nodejs 8?, as webpack 5 still supporting nodejs 8 and higher? HOT 6
- url-loader 3.0.0 creates an erroneous export HOT 2
- Usage with require.context? HOT 1
- Blob Url Support HOT 1
- Images not inlined in Svelte 3 app HOT 1
- option to prefix URLs with `file://` HOT 3
- DataURL images also send network request to public path HOT 7
- [question] Do we have webpack 5 support coming for this lib? HOT 1
- NonErrorEmittedError: (Emitted value instead of an instance of Error) Error in parsing SVG: Non-whitespace before first tag. HOT 1
- Different default limit values in documentation HOT 3
- tree shake do not work with image HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from url-loader.