{"bugs":{"url":"https://github.com/raxjs/rax-app/issues"},"dist":{"shasum":"0bad19a206258a9acf686766304b9f0346524bc2","tarball":"https://registry.npmjs.org/stylesheet-loader/-/stylesheet-loader-0.9.1-beta.9.tgz","fileCount":47,"integrity":"sha512-JLrBAX8xfzTUCyPnM7XetWMX/JNn5wZCzi5KSpxcRUUIU6z5kHYh6DHpvhOsc7XeGhV+8fIaznzKK8NJE8j+Vg==","signatures":[{"sig":"MEQCIAYKJrRWwyH8sxXDUMvVmykJlNvxyQtZ4wkZiF/kZKVIAiAf39tIhwR6Uw7FB9uqh0sE9D7NQ2QbuPFVFxDqIkG3Tw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":73078,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJie3nbACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrbNQ/+KhoM2NNHTFKyrGGiUBYd9oTCEs/yNVLvPQSmmVqBkaJwsX9k\r\nA9darXjiqvjyRj8ZgZAgXGlhnQ7/EWGEnHYG5ptP91bxZB7GcAWMtXWZsuZp\r\npGTyZkz9ECp2Cdt/Sta8A+/0A5/gPDeEBKEqLz9+c99b+q4+BavJvoCZMcVs\r\n009pPTRDXJ6HLUWCv2outlUdRXiG3w3fwWz4CnQcMzMWJO9I4Ep5KEVUCSDE\r\ndMn2xyFqMcZP+1poHHiyRQgiDtjizDho9oM7fwuq4VvftHC9OL+8EUrkA362\r\nXQGudlHoBok+s0NO3tvMh+SZnREK/uv9yDRUA7cCpw79XaqLbZ08wEWk/aF0\r\nrl48jNIoLdFy7t730cHWzwiwy4lZ4OFMcPmCOaGBig4W2pd92T/NkpUOoRKf\r\ncfDmsCjRK8HaQR4DnlinG4tXitVG/D06Usw3jPyrc5crItyNM4UmLhgBxBrt\r\nYabdywTOKwwEhUwlAyD+P3RfTOHfZDSwRXxD7KEKFSiw39vhAdFf+O4U1xu3\r\nxTHjyKYKgbUS4+dXQuoRcJ7vUksPjri7Gbykw+nxaUnlZW3BrzshOT2sxU8/\r\nJS4//BdmNCFdnXq54ccXXLmzFrFd1IL2tuV5bRgJmVh5muBbgqM0jCwaDW6M\r\nKaIcsrDc84EOgfrWWqO4jRAjCoD5is9KfMw=\r\n=8rW2\r\n-----END PGP SIGNATURE-----\r\n"},"main":"lib/index.js","name":"stylesheet-loader","readme":"# stylesheet-loader\n\n> A webpack loader that imports a css file and converts it to be used as an inline style\n\n## Install\n\n```sh\nnpm install --save-dev stylesheet-loader\n```\n\n## Usage\n\n[Documentation: Using loaders](http://webpack.github.io/docs/using-loaders.html)\n\nConfig stylesheet loader in `webpack.config.js`:\n```js\n// webpack.config.js\n\nmodule.export = {\n module: {\n loaders: [\n {\n test: /\\.css$/,\n loader: 'stylesheet'\n }\n ]\n }\n};\n```\n\n```css\n/* foo.css */\n.container {\n background-color: blue;\n}\n\n.container_title {\n font-size: 20px;\n}\n```\n\n```js\n// foo.js\nimport styles from './foo.css';\n\nfunction Foo() {\n return
\n hello world\n
;\n}\nexport default Foo;\n```\n\n### tag/id selector\n\n```css\ndiv {\n color: red;\n}\n\n#main {\n width: 100%;\n}\n```\n\n```js\n{\n '@div': {\n color: 'red'\n },\n '#main': {\n width: '100%'\n }\n}\n```\n\n\n\n### Write less\n\n`webpack.config.js`:\n```\n{\n test: /\\.less$/,\n loader: 'stylesheet!less'\n}\n```\n\n```less\n// foo.less\n@contaner-bg: #5B83AD;\n@title-size: 20px;\n\n.container {\n background-color: @contaner-bg;\n}\n\n.container_title {\n font-size: @title-size;\n}\n```\n\n```js\n// foo.less\nimport styles from './foo.less';\n\nfunction Foo() {\n return
\n hello world\n
;\n}\nexport default Foo;\n```\n\n### Options\n\n#### `transformDescendantCombinator`\n\nDefault does not support nested, but you can also choose to avoid this constraint when set `transformDescendantCombinator` to true.\n\n### Support font-face\n\n```css\n@font-face {\n font-family: icon;\n src: url(http://at.alicdn.com/t/font_pkm0oq8is8fo5hfr.ttf);\n}\n```\n\n### Support media query\n\nMedia type support `screen` and `all`. Media features only support `width` and `height`. Look [@media](https://developer.mozilla.org/en-US/docs/Web/CSS/@media).\n\n```css\n@media screen and (min-width: 480px) {\n .title {\n font-size: 25rem;\n }\n}\n```\n\n### Support pseudo class\n\nPseudo class only in weex. Index of support pseudo classes\n\n* `:active`\n* `:focus`\n* `:disabled`\n* `:enabled`\n\nExample\n```css\n.container:active {\n background-color: red;\n}\n```\n\n### Support gradient\n\nYou can use gradient in Weex 0.10.0+.\n\n```css\nbackground-image: linear-gradient(to right, blue, white);\n```\n\n### Support global css variables\n\nYou can write `var()` in css. Variables need to be defined in `:root`\n\n```css\n:root {\n --color-error-1: red;\n}\n.text {\n color: var(--color-error-1);\n}\n```\n\n### Support light or dark color theme.\n\n**Web:**\n\n```css\nbody { background-color: #ffffff; }\n@media (prefers-color-scheme: dark) {\n body { background-color: #000000; }\n}\n@media (prefers-color-scheme: light) {\n body { background-color: #ffffff; }\n}\n```\n**Weex:**\n\nCompile to -weex-dark-scheme-xxx and -weex-light-scheme-xxx\n\n```css\nbody {\n background-color: #ffffff;\n -weex-dark-scheme-background-color: #000000;\n -weex-light-scheme-background-color: #ffffff;\n}\n```\n\n## Validation\n\nWe followed the [css-layout](https://github.com/facebook/yoga) style standard. There will be a friendly reminder on the console when your code is not standardized.\n\n

\n \"stylesheet\n

\n","license":"BSD-3-Clause","_npmUser":{"name":"rax-publisher","email":"rax-public@alibaba-inc.com"},"homepage":"https://github.com/raxjs/rax-app#readme","repository":{"url":"git+https://github.com/raxjs/rax-app.git","type":"git"},"_npmVersion":"6.14.12","description":"Stylesheet loader.","directories":{},"maintainers":[{"name":"zeroling","email":"wssgcg1213@qq.com"},{"name":"wintercn","email":"csf178@gmail.com"},{"name":"yuanyan","email":"yuanyan.cao@gmail.com"},{"name":"boiawang","email":"zhengwang2314@gmail.com"},{"name":"yacheng","email":"narutosun2@163.com"},{"name":"rax-publisher","email":"rax-public@alibaba-inc.com"}],"_nodeVersion":"12.22.1","dependencies":{"css":"^2.2.1","chalk":"^1.1.3","camelcase":"^3.0.0","loader-utils":"^1.2.3"},"_hasShrinkwrap":false,"readmeFilename":"README.md","_npmOperationalInternal":{"tmp":"tmp/stylesheet-loader_0.9.1-beta.9_1652259291628_0.9875837619992041","host":"s3://npm-registry-packages"},"_id":"stylesheet-loader@0.9.1-beta.9","version":"0.9.1-beta.9"}