style loader module for webpack
require"style!raw!./file.css";// => add rules in file.css to document
It's recommended to combine it with the
It also possible to add a URL instead of a css string:
require"style/url!file!./file.css";// => add a <link rel="stylesheet"> to file.css to document
var style = require"style/useable!css!./file.css";styleuse; // = style.ref();styleunuse; // = style.unref();
Styles are not added on require, but instead on call to
ref. Styles are removed from page if
unref is called exactly as often as
Note: Behavior is undefined when
unref is called more often than
ref. Don't do that.
If defined, the style-loader will re-use a single
<style> element, instead of adding/removing individual elements for each required module. Note: this option is on by default in IE9, which has strict limitations on the # of style tags allowed on a page. You can enable or disable it with the singleton query parameter (
By convention the reference-counted API should be bound to
.useable.css and the simple API to
.css (similar to other file types, i. e.
So the recommended configuration for webpack is:
module:loaders:test: /\.css$/ exclude: /\.useable\.css$/ loader: "style!css"test: /\.useable\.css$/ loader: "style/useable!css"
npm install style-loader