chore(readme): Update to webpack standard format
parent
e2e69562c9
commit
d4632364ec
61
README.md
61
README.md
|
@ -1,14 +1,25 @@
|
||||||
# style loader for webpack
|
[![npm][npm]][npm-url]
|
||||||
|
[![node][node]][node-url]
|
||||||
|
[![deps][deps]][deps-url]
|
||||||
|
[![chat][chat]][chat-url]
|
||||||
|
|
||||||
|
<div align="center">
|
||||||
|
<a href="https://github.com/webpack/webpack">
|
||||||
|
<img width="200" height="200"
|
||||||
|
src="https://webpack.js.org/assets/icon-square-big.svg">
|
||||||
|
</a>
|
||||||
|
<h1>Style Loader</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
Adds CSS to the DOM by injecting a `<style>` tag
|
Adds CSS to the DOM by injecting a `<style>` tag
|
||||||
|
|
||||||
## Install
|
<h2 align="center">Install</h2>
|
||||||
|
|
||||||
```
|
```
|
||||||
npm install style-loader --save-dev
|
npm install style-loader --save-dev
|
||||||
```
|
```
|
||||||
|
|
||||||
## Usage
|
<h2 align="center">Usage</h2>
|
||||||
|
|
||||||
[Documentation: Using loaders](http://webpack.github.io/docs/using-loaders.html)
|
[Documentation: Using loaders](http://webpack.github.io/docs/using-loaders.html)
|
||||||
|
|
||||||
|
@ -61,7 +72,7 @@ By default, the style-loader appends `<style>` elements to the end of the `<head
|
||||||
|
|
||||||
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 number of style tags allowed on a page. You can enable or disable it with the singleton query parameter (`?singleton` or `?-singleton`).
|
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 number of style tags allowed on a page. You can enable or disable it with the singleton query parameter (`?singleton` or `?-singleton`).
|
||||||
|
|
||||||
## Recommended configuration
|
### Recommended configuration
|
||||||
|
|
||||||
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. `.useable.less` and `.less`).
|
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. `.useable.less` and `.less`).
|
||||||
|
|
||||||
|
@ -97,6 +108,44 @@ So the recommended configuration for webpack is:
|
||||||
|
|
||||||
**Note** about source maps support and assets referenced with `url`: when style loader is used with ?sourceMap option, the CSS modules will be generated as `Blob`s, so relative paths don't work (they would be relative to `chrome:blob` or `chrome:devtools`). In order for assets to maintain correct paths setting `output.publicPath` property of webpack configuration must be set, so that absolute paths are generated.
|
**Note** about source maps support and assets referenced with `url`: when style loader is used with ?sourceMap option, the CSS modules will be generated as `Blob`s, so relative paths don't work (they would be relative to `chrome:blob` or `chrome:devtools`). In order for assets to maintain correct paths setting `output.publicPath` property of webpack configuration must be set, so that absolute paths are generated.
|
||||||
|
|
||||||
## License
|
<h2 align="center">Contributing</h2>
|
||||||
|
|
||||||
MIT (http://www.opensource.org/licenses/mit-license.php)
|
Don't hesitate to create a pull request. Every contribution is appreciated. In development you can start the tests by calling `npm test`.
|
||||||
|
|
||||||
|
<h2 align="center">Maintainers</h2>
|
||||||
|
|
||||||
|
<table>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td align="center">
|
||||||
|
<img width="150 height="150"
|
||||||
|
src="https://avatars.githubusercontent.com/sokra?v=3">
|
||||||
|
<br />
|
||||||
|
<a href="https://github.com/">Tobias Koppers</a>
|
||||||
|
</td>
|
||||||
|
<td align="center">
|
||||||
|
<img width="150 height="150"
|
||||||
|
src="https://avatars.githubusercontent.com/SpaceK33z?v=3">
|
||||||
|
<br />
|
||||||
|
<a href="https://github.com/">Kees Kluskens</a>
|
||||||
|
</td>
|
||||||
|
<tr>
|
||||||
|
<tbody>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
|
||||||
|
<h2 align="center">LICENSE</h2>
|
||||||
|
|
||||||
|
#### [MIT](./LICENSE)
|
||||||
|
|
||||||
|
[npm]: https://img.shields.io/npm/v/style-loader.svg
|
||||||
|
[npm-url]: https://npmjs.com/package/style-loader
|
||||||
|
|
||||||
|
[node]: https://img.shields.io/node/v/style-loader.svg
|
||||||
|
[node-url]: https://nodejs.org
|
||||||
|
|
||||||
|
[deps]: https://david-dm.org/webpack/style-loader.svg
|
||||||
|
[deps-url]: https://david-dm.org/webpack/file-loader
|
||||||
|
|
||||||
|
[chat]: https://badges.gitter.im/webpack/webpack.svg
|
||||||
|
[chat-url]: https://gitter.im/webpack/webpack
|
||||||
|
|
Loading…
Reference in New Issue