Comments (10)
Got it, I didn't know you meant it that literally :)
So what I do with my dom-loader is
{ test: /\.css$/, loader: 'dom?tag=style&attrs[]=type:text/css!css' }
from style-loader.
If I make a PR for this, is there any chance of it getting merged?
from style-loader.
@sokra I've been trying to figure out how to implement this, but it looks next to impossible with the way this loader is set up. Perhaps I'm wrong, but then I would love some pointers in the right direction. If I really want this, am I better off making my own loader?
from style-loader.
i m not sure what features you are loosing by doing this, but i was able to do the above using css-to-string-loader loader and just adding the style var manually
from style-loader.
How do you achieve that? In the mean time I released https://www.npmjs.com/package/dom-loader that can be used for this (and other elements).
from style-loader.
i use a react render to iframe component and i needed css reset to be rendered in the iframe, not in the main head. using css to string, i load the css in a var and pass it to the Frame component
import mainStyles from 'normalize.css';
...
<Frame style={styles.frame} scrolling={'no'}
initialContent={`<!DOCTYPE html><html style="width: 100%; height: 100%;">
<head><style type="text/css">${mainStyles}</style></head>
<body>
<div></div>
</body></html>`}>
seems to work fine for me
cheers
from style-loader.
What is "CSS to string"? You mean just a raw loader?
from style-loader.
https://www.npmjs.com/package/css-to-string-loader
from style-loader.
@ronkorving, was your issue fixed with that loader? I don't think this functionality should be in style-loader.
from style-loader.
I went with my alternative at the time, so can't really say. It probably worked fine. I'll close this issue, sorry for having kept it open so long.
from style-loader.
Related Issues (20)
- Appropriate loader handler for specific file only. HOT 2
- TypeError: this.getOptions is not a function HOT 19
- Style-loader duplicates insert function HOT 3
- HMR does not work with webpack 5 HOT 3
- Changes to `insert` module file do not trigger cache invalidation HOT 4
- i can't download the module HOT 1
- HMR does not work HOT 1
- What style-loaders expects as input? HOT 5
- Is there a injectType=lazyStyleTag .use() & .unuse() equivalent when using css-loader + mini-css-extract-plugin HOT 11
- Add support for using lazyStyleTag use() from a JavaScript module (injecting into multiple shadow DOMs) HOT 21
- why style-loader is pitch loader? HOT 2
- Support asset-modules instead of file-loader HOT 3
- Webpack "lazyStyleTag" configuration won't copy fonts after upgrade to Angular 13 HOT 18
- Noop in environment without DOM api HOT 1
- Can not export selectors from `@import url(...)` HOT 2
- Get CSS properties / variables from JavaScript HOT 3
- Vulnerable dependencies (indirect security issues) HOT 1
- webpack 5 is returning a object instead URL HOT 2
- Promotion of unsafe code HOT 1
- Excessive whitespace and line breaks in code generated by style-loader HOT 1
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 style-loader.