{"_id":"@c0ldra1n/next-css","_rev":"3-29aaace0781930fc5d39d5314dbc1ac4","name":"@c0ldra1n/next-css","dist-tags":{"latest":"0.2.1-canary.6"},"versions":{"0.2.1-canary.4":{"name":"@c0ldra1n/next-css","version":"0.2.1-canary.4","main":"index.js","license":"MIT","dependencies":{"css-loader":"^2.1.0","extract-css-chunks-webpack-plugin":"^3.3.2","find-up":"^3.0.0","ignore-loader":"~0.1.2","optimize-css-assets-webpack-plugin":"^5.0.1","postcss-loader":"^3.0.0"},"devDependencies":{"webpack":"^4.29.5"},"description":"Import `.css` files in your Next.js project","_id":"@c0ldra1n/next-css@0.2.1-canary.4","_nodeVersion":"12.7.0","_npmVersion":"6.10.0","dist":{"integrity":"sha512-kEmBYpd/lvgYSzBmy8vOyd24Ia0lgeq5C1AQUUNPBF/k4l1/Lmz8EJGkHfQdhiuwEt3mnyZqGIAyKA9y4WJPrw==","shasum":"1af6fe38d1d92232f5dc1b0868dddc75753ff229","tarball":"https://registry.npmjs.org/@c0ldra1n/next-css/-/next-css-0.2.1-canary.4.tgz","fileCount":4,"unpackedSize":8937,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdSAYyCRA9TVsSAnZWagAAWjYP/ijbiOj9V7t19tBQ0KTW\nt1spldrR57gxZ0RZhpq3h7tJcY4fO+ARuFGlcdsunOj/t9LnfZlLuSF7G9pG\ndF78k8Is3CNbBDLA/ORUaPPCP2vv33wmh6TOc3bLjFexoFQzz0pfcCSCICVX\n37vn/Zo22944w+SaorM5S+m0ItlF5T4A1w0XkgKgsWeVWUdtjnxkzxFJV/40\naxRSanhALb3+H1PM9xmlktTdnANsqSxdgs6BfCnDixSb5JmC8BT2inpj0GfO\ntTaQMjjDtP7Jl4ttF9koIs2+x6U9T+oeSoLKbCi29s6m5OKm/HqKVwstngLC\nnHteKrp1noU1R1vzE8GE7P3NgGHZVHNoXTjoP+YkH9/6efq26jwonfwoJxI2\n/3G39AVDyB/eUS1JE9UgEdXYHC1LfQ5bZPRhfq6Vq/bygg8BRHP3dlzxADne\n7gu4AeiKxHYEIagIhevdWLWRiy5lst6SodBlUYlfwL3Zj8mHpewGW50Lbysi\nE3jdyOseZtuVlXJM8U2gjYyPXK+2giPF71Vv2Wr1QsRNvY0FGZCg6bFPG+8X\ng2qo3TpesKF+9tlrl/uoTfFmQkh4iBGAAk63BresAn1oZsfkWFGO7csFWEMx\nlvr3fRDYCIfjri0HBMuIY9wSwwbTitoMDOt9pMDFtibqBWzVKJVsmMcVSjYD\nHgCe\r\n=curP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIA9aFlQ5ryKpJtCVsRF+2ulUxROlH+EOeKapcuK7Sl/5AiEA+cOl4g1L1g4MKJY0txJBbTpY8xywX746En0NVBKDq9k="}]},"maintainers":[{"name":"c0ldra1n","email":"c0ldra1n.dev@gmail.com"}],"_npmUser":{"name":"c0ldra1n","email":"c0ldra1n.dev@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/next-css_0.2.1-canary.4_1565001265357_0.35736088650172504"},"_hasShrinkwrap":false},"0.2.1-canary.5":{"name":"@c0ldra1n/next-css","version":"0.2.1-canary.5","main":"index.js","license":"MIT","dependencies":{"css-loader":"^2.1.0","extract-css-chunks-webpack-plugin":"^3.3.2","find-up":"^3.0.0","ignore-loader":"~0.1.2","optimize-css-assets-webpack-plugin":"^5.0.1","postcss-loader":"^3.0.0"},"devDependencies":{"webpack":"^4.29.5"},"description":"Import `.css` files in your Next.js project","_id":"@c0ldra1n/next-css@0.2.1-canary.5","_nodeVersion":"12.7.0","_npmVersion":"6.10.0","dist":{"integrity":"sha512-FhRVKYcjghXDqrEe4/YRrMnsBN1cbj9a0icPichODOseG3FztZA+QVH75gYZDd2GC2Z6WVzF7/ZIFCREQ0tG5g==","shasum":"6aa85b19b55ae8c37b7a1d63f283da986454f391","tarball":"https://registry.npmjs.org/@c0ldra1n/next-css/-/next-css-0.2.1-canary.5.tgz","fileCount":4,"unpackedSize":8909,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdSAinCRA9TVsSAnZWagAAW08P/0xbX2jUMPTtSefQwt24\nXgjb0qZNPehVbAl/pnN3YZczjGFKikiP6W4XVz0qGe1hJy478IWawmQ/HnRG\nS7zLc+eVTL4mot7LceWZtwJLaHt4N8SszLaJ0Gw/z9RjvhRR5F7XCyTO9T6X\n9Ux3+jbephBiZk96qQXo4HHmjciKv7vexAGj25kGdiUzRno7ggLUVSBnMhJm\nvHqVejK/gO2lnDFSvIyKRYay5Ux/ksBD7qkHCM3jQb7SgKwY8IjOVNA0VOXK\nVHjnK9oA5R0/LfjSsG4j4dTYHudz9r0cM5Ea8b2pDzP5mZ/BJWiZnmN7Eqyz\nXVMeoNWpG51/G8bAmJ2Pleim9qsuzgiznrGFWsE/KSl2TZt4QyNqDXf2tseQ\ndq3fD5mR/Pdt3KJsj15Y1sXaj7BGyntQ2NN5GiOBfOrTf7Bd5LUwKjE4DK4+\ny+rfVOyWpBue1AHE1IK2KL3xgYgxdt8qLy5GG/6+ACHFh/qb8ydQXN38KyMH\ndn51zGQA15gtmwNQuh8dNqv4Oqa5JyzJGdQ1FLr6EnVknuzVa8ougk78GqIK\nIeohZjDr3ozA7054Ut7rbXgfhO6Eu3np2Y3OZv+24ddsKNQb4DToH3c8ir5J\npr1XQcr16L2A7GeISQHg3qxUJ2tb3RRnUc8kNYreSa0pwGCUIK6XB4yICZJQ\nD3fm\r\n=SHOi\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE3tIJJrLB85qx7AaY7EXL2REzpssQuR7VIOx8fVBrtKAiBK8NGHu+kdmG6NpDpS4KCP5QHRgXrAt0ScNKM/eEM4uw=="}]},"maintainers":[{"name":"c0ldra1n","email":"c0ldra1n.dev@gmail.com"}],"_npmUser":{"name":"c0ldra1n","email":"c0ldra1n.dev@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/next-css_0.2.1-canary.5_1565001894774_0.3803005218244895"},"_hasShrinkwrap":false},"0.2.1-canary.6":{"name":"@c0ldra1n/next-css","version":"0.2.1-canary.6","main":"index.js","license":"MIT","dependencies":{"css-loader":"^2.1.0","extract-css-chunks-webpack-plugin":"^3.3.2","find-up":"^3.0.0","ignore-loader":"~0.1.2","optimize-css-assets-webpack-plugin":"^5.0.1","postcss-loader":"^3.0.0"},"devDependencies":{"webpack":"^4.29.5"},"description":"Import `.css` files in your Next.js project","_id":"@c0ldra1n/next-css@0.2.1-canary.6","_nodeVersion":"12.7.0","_npmVersion":"6.10.0","dist":{"integrity":"sha512-3u6ls1/gBg1lODhnbnsRLZ71V10wz6J8XPX3RSlAxNZDLo5Wq+IJ9rYvKA60S6l6I/dGB0oHjeB/3pwfIQPeHg==","shasum":"2f86948368f7a0ad57648680cd196b9c42decdbd","tarball":"https://registry.npmjs.org/@c0ldra1n/next-css/-/next-css-0.2.1-canary.6.tgz","fileCount":4,"unpackedSize":8858,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdSAqGCRA9TVsSAnZWagAAE6QP/jV6CdvHfMMw1WTbExgy\nqxUMUR133Z86PqWts2pQL7ZmzVWGgG+Q/7Hi4gN2ig+8pHsmrx/JQTnmgLIF\nZ0bMfNb4qLFoXav2qB+TzBVUar2VZLBOJiuXFBT7BUtJj/9QxUm7Xw2oSKb3\nO7e4Wy3TctvlsJmzz9mK5st0o5J6cnIJAn+ORT6LZN69DCB403Byw9xSD3N8\noanmJyphqMYWlHFG0O1gvHSxEqxbbDKUkphKm6EtXY251aC//gqDKhEgdAhX\nG29Ehuk2GZXsHB1/wobcCcaXgZbmQUIw7XynZp5X7kCmCt/3p/IA+iIy3Isc\ndz9l+46I0ensUcthR6o7KAkvBkr9mgKoZSHGLQWhm4hvWi3FtlVpKBF06wrk\nu7FezLiAfG1lbWk0U3o5KQOSBaCo5j6DQlZBAAYK4qGvzVA6O9+/MUj1s7TN\nqWMwALd3ZSW4P4/tcpeTD03ozXvOvTbRE04gqedcVitCidX0oVz+WAucveGs\nk0CcNyfBiHfT6Fq2sHJqfOKVY2EkgFOWP8tE49yymsewTp8lgXajR9jdfuMI\n6JzhRoi77x/zyAKEH2SHWJraw3QISF/GprX/Edm/HiCBUrhci0Cua87VT0Rs\n6UC5FRCOM2ffmEkOgmR4Fu7BkalyQ4WSKbD43qjeRH6oDpH+QUfBwVMNN1kK\nZyCr\r\n=+ggE\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDBvgIu2fB7GJU0n3uskeII6NfPsug5GS96awGMvyPk3wIgf3qVUOn76zA8XdpYy3EnEzS6Jgj1BeZQbNWoaRt09jA="}]},"maintainers":[{"name":"c0ldra1n","email":"c0ldra1n.dev@gmail.com"}],"_npmUser":{"name":"c0ldra1n","email":"c0ldra1n.dev@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/next-css_0.2.1-canary.6_1565002373620_0.8457364280726867"},"_hasShrinkwrap":false}},"time":{"created":"2019-08-05T10:34:25.148Z","0.2.1-canary.4":"2019-08-05T10:34:25.475Z","modified":"2022-04-04T21:23:59.116Z","0.2.1-canary.5":"2019-08-05T10:44:54.917Z","0.2.1-canary.6":"2019-08-05T10:52:53.744Z"},"maintainers":[{"name":"c0ldra1n","email":"c0ldra1n.dev@gmail.com"}],"description":"Import `.css` files in your Next.js project","license":"MIT","readme":"# Next.js + CSS\n\nImport `.css` files in your Next.js project\n\n## Installation\n\n```\nnpm install --save @zeit/next-css\n```\n\nor\n\n```\nyarn add @zeit/next-css\n```\n\n## Usage\n\nThe stylesheet is compiled to `.next/static/css`. Next.js will automatically add the css file to the HTML. \nIn production a chunk hash is added so that styles are updated when a new version of the stylesheet is deployed.\n\n### Without CSS modules\n\nCreate a `next.config.js` in the root of your project (next to pages/ and package.json)\n\n```js\n// next.config.js\nconst withCSS = require('@zeit/next-css')\nmodule.exports = withCSS({\n /* config options here */\n})\n```\n\nCreate a CSS file `style.css`\n\n```css\n.example {\n font-size: 50px;\n}\n```\n\nCreate a page file `pages/index.js`\n\n```js\nimport \"../style.css\"\n\nexport default () =>
Hello World!
\n```\n\n__Note: CSS files can _not_ be imported into your [`_document.js`](https://github.com/zeit/next.js#custom-document). You can use the [`_app.js`](https://github.com/zeit/next.js#custom-app) instead or any other page.__\n\n### With CSS modules\n\n```js\n// next.config.js\nconst withCSS = require('@zeit/next-css')\nmodule.exports = withCSS({\n cssModules: true\n})\n```\n\nCreate a CSS file `style.css`\n\n```css\n.example {\n font-size: 50px;\n}\n```\n\nCreate a page file `pages/index.js`\n\n```js\nimport css from \"../style.css\"\n\nexport default () =>
Hello World!
\n```\n\n### With CSS modules and options\n\nYou can also pass a list of options to the `css-loader` by passing an object called `cssLoaderOptions`.\n\nFor instance, [to enable locally scoped CSS modules](https://github.com/css-modules/css-modules/blob/master/docs/local-scope.md#css-modules--local-scope), you can write:\n\n```js\n// next.config.js\nconst withCSS = require('@zeit/next-css')\nmodule.exports = withCSS({\n cssModules: true,\n cssLoaderOptions: {\n importLoaders: 1,\n localIdentName: \"[local]___[hash:base64:5]\",\n }\n})\n```\n\nCreate a CSS file `styles.css`\n\n```css\n.example {\n font-size: 50px;\n}\n```\n\nCreate a page file `pages/index.js` that imports your stylesheet and uses the hashed class name from the stylesheet\n\n```js\nimport css from \"../style.css\"\n\nconst Component = props => {\n return (\n
\n ...\n
\n )\n}\n\nexport default Component\n```\n\nYour exported HTML will then reflect locally scoped CSS class names.\n\nFor a list of supported options, [refer to the webpack `css-loader` README](https://github.com/webpack-contrib/css-loader#options).\n\n### PostCSS plugins\n\nCreate a `next.config.js` in your project\n\n```js\n// next.config.js\nconst withCSS = require('@zeit/next-css')\nmodule.exports = withCSS({\n /* config options here */\n})\n```\n\nCreate a `postcss.config.js`\n\n```js\nmodule.exports = {\n plugins: {\n // Illustrational\n 'postcss-css-variables': {}\n }\n}\n```\n\nCreate a CSS file `style.css` the CSS here is using the css-variables postcss plugin.\n\n```css\n:root {\n --some-color: red;\n}\n\n.example {\n /* red */\n color: var(--some-color);\n}\n```\n\nWhen `postcss.config.js` is not found `postcss-loader` will not be added and will not cause overhead.\n\nYou can also pass a list of options to the `postcss-loader` by passing an object called `postcssLoaderOptions`.\n\nFor example, to pass theme env variables to postcss-loader, you can write:\n\n```js\n// next.config.js\nconst withCSS = require('@zeit/next-css')\nmodule.exports = withCSS({\n postcssLoaderOptions: {\n parser: true,\n config: {\n ctx: {\n theme: JSON.stringify(process.env.REACT_APP_THEME)\n }\n }\n }\n})\n```\n\n\n\n### Configuring Next.js\n\nOptionally you can add your custom Next.js configuration as parameter\n\n```js\n// next.config.js\nconst withCSS = require('@zeit/next-css')\nmodule.exports = withCSS({\n webpack(config, options) {\n return config\n }\n})\n```\n","readmeFilename":"readme.md"}