{ "manifest": { "name": "postcss-load-config", "version": "4.0.2", "description": "Autoload Config for PostCSS", "main": "src/index.js", "types": "src/index.d.ts", "files": [ "src" ], "engines": { "node": ">= 14" }, "funding": [ { "type": "opencollective", "url": "https://opencollective.com/postcss/" }, { "type": "github", "url": "https://github.com/sponsors/ai" } ], "dependencies": { "lilconfig": "^3.0.0", "yaml": "^2.3.4" }, "peerDependencies": { "postcss": ">=8.0.9", "ts-node": ">=9.0.0" }, "peerDependenciesMeta": { "ts-node": { "optional": true }, "postcss": { "optional": true } }, "keywords": [ "postcss", "postcssrc", "postcss.config.js" ], "author": { "name": "Michael Ciniawky", "email": "michael.ciniawsky@gmail.com" }, "contributors": [ { "name": "Ryan Dunckel" }, { "name": "Mateusz Derks" }, { "name": "Dalton Santos" }, { "name": "Patrick Gilday" }, { "name": "François Wouts" } ], "repository": { "type": "git", "url": "https://github.com/postcss/postcss-load-config.git" }, "license": "MIT", "_registry": "npm", "_loc": "/homez.1033/heliovt/.cache/yarn/v6/npm-postcss-load-config-4.0.2-7159dcf626118d33e299f485d6afe4aff7c4a3e3-integrity/node_modules/postcss-load-config/package.json", "readmeFilename": "README.md", "readme": "\n\n
\n \n \n \n \n \n

Load Config

\n
\n\n

Install

\n\n```bash\nnpm i -D postcss-load-config\n```\n\n

Usage

\n\n```bash\nnpm i -S|-D postcss-plugin\n```\n\nInstall all required PostCSS plugins and save them to your **package.json** `dependencies`/`devDependencies`\n\nThen create a PostCSS config file by choosing one of the following formats\n\n### `package.json`\n\nCreate a **`postcss`** section in your project's **`package.json`**\n\n```\nProject (Root)\n |– client\n |– public\n |\n |- package.json\n```\n\n```json\n{\n \"postcss\": {\n \"parser\": \"sugarss\",\n \"map\": false,\n \"plugins\": {\n \"postcss-plugin\": {}\n }\n }\n}\n```\n\n### `.postcssrc`\n\nCreate a **`.postcssrc`** file in JSON or YAML format\n\n> ℹ️ It's recommended to use an extension (e.g **`.postcssrc.json`** or **`.postcssrc.yml`**) instead of `.postcssrc`\n\n```\nProject (Root)\n |– client\n |– public\n |\n |- (.postcssrc|.postcssrc.json|.postcssrc.yml)\n |- package.json\n```\n\n**`.postcssrc.json`**\n```json\n{\n \"parser\": \"sugarss\",\n \"map\": false,\n \"plugins\": {\n \"postcss-plugin\": {}\n }\n}\n```\n\n**`.postcssrc.yml`**\n```yaml\nparser: sugarss\nmap: false\nplugins:\n postcss-plugin: {}\n```\n\n### `.postcssrc.js` or `postcss.config.js`\n\nYou may need some logic within your config.\nIn this case create JS file named:\n- `.postcssrc.js`\n- `.postcssrc.mjs`\n- `.postcssrc.cjs`\n- `.postcssrc.ts`\n- `.postcssrc.cts`\n- `postcss.config.js`\n- `postcss.config.mjs`\n- `postcss.config.cjs`\n- `postcss.config.ts`\n- `postcss.config.cts`\n\n```\nProject (Root)\n |– client\n |– public\n |- (.postcssrc|postcss.config).(js|mjs|cjs|ts|cts)\n |- package.json\n```\n\nYou can export the config as an `{Object}`\n\n**.postcssrc.js**\n```js\nmodule.exports = {\n parser: 'sugarss',\n map: false,\n plugins: {\n 'postcss-plugin': {}\n }\n}\n```\n\nOr export a `{Function}` that returns the config (more about the `ctx` param below)\n\n**.postcssrc.js**\n```js\nmodule.exports = (ctx) => ({\n parser: ctx.parser ? 'sugarss' : false,\n map: ctx.env === 'development' ? ctx.map : false,\n plugins: {\n 'postcss-plugin': ctx.options.plugin\n }\n})\n```\n\nPlugins can be loaded either using an `{Object}` or an `{Array}`\n\n#### `{Object}`\n\n**.postcssrc.js**\n```js\nmodule.exports = ({ env }) => ({\n ...options,\n plugins: {\n 'postcss-plugin': env === 'production' ? {} : false\n }\n})\n```\n\n> ℹ️ When using an `{Object}`, the key can be a Node.js module name, a path to a JavaScript file that is relative to the directory of the PostCSS config file, or an absolute path to a JavaScript file.\n\n#### `{Array}`\n\n**.postcssrc.js**\n```js\nmodule.exports = ({ env }) => ({\n ...options,\n plugins: [\n env === 'production' ? require('postcss-plugin')() : false\n ]\n})\n```\n> :warning: When using an `{Array}`, make sure to `require()` each plugin\n\n

Options

\n\n|Name|Type|Default|Description|\n|:--:|:--:|:-----:|:----------|\n|[**`to`**](#to)|`{String}`|`undefined`|Destination File Path|\n|[**`map`**](#map)|`{String\\|Object}`|`false`|Enable/Disable Source Maps|\n|[**`from`**](#from)|`{String}`|`undefined`|Source File Path|\n|[**`parser`**](#parser)|`{String\\|Function}`|`false`|Custom PostCSS Parser|\n|[**`syntax`**](#syntax)|`{String\\|Function}`|`false`|Custom PostCSS Syntax|\n|[**`stringifier`**](#stringifier)|`{String\\|Function}`|`false`|Custom PostCSS Stringifier|\n\n### `parser`\n\n**.postcssrc.js**\n```js\nmodule.exports = {\n parser: 'sugarss'\n}\n```\n\n### `syntax`\n\n**.postcssrc.js**\n```js\nmodule.exports = {\n syntax: 'postcss-scss'\n}\n```\n\n### `stringifier`\n\n**.postcssrc.js**\n```js\nmodule.exports = {\n stringifier: 'midas'\n}\n```\n\n### [**`map`**](https://github.com/postcss/postcss/blob/master/docs/source-maps.md)\n\n**.postcssrc.js**\n```js\nmodule.exports = {\n map: 'inline'\n}\n```\n\n> :warning: In most cases `options.from` && `options.to` are set by the third-party which integrates this package (CLI, gulp, webpack). It's unlikely one needs to set/use `options.from` && `options.to` within a config file. Unless you're a third-party plugin author using this module and its Node API directly **dont't set `options.from` && `options.to` yourself**\n\n### `to`\n\n```js\nmodule.exports = {\n to: 'path/to/dest.css'\n}\n```\n\n### `from`\n\n```js\nmodule.exports = {\n from: 'path/to/src.css'\n}\n```\n\n

Plugins

\n\n### `{} || null`\n\nThe plugin will be loaded with defaults\n\n```js\n'postcss-plugin': {} || null\n```\n\n**.postcssrc.js**\n```js\nmodule.exports = {\n plugins: {\n 'postcss-plugin': {} || null\n }\n}\n```\n\n> :warning: `{}` must be an **empty** `{Object}` literal\n\n### `{Object}`\n\nThe plugin will be loaded with given options\n\n```js\n'postcss-plugin': { option: '', option: '' }\n```\n\n**.postcssrc.js**\n```js\nmodule.exports = {\n plugins: {\n 'postcss-plugin': { option: '', option: '' }\n }\n}\n```\n\n### `false`\n\nThe plugin will not be loaded\n\n```js\n'postcss-plugin': false\n```\n\n**.postcssrc.js**\n```js\nmodule.exports = {\n plugins: {\n 'postcss-plugin': false\n }\n}\n```\n\n### `Ordering`\n\nPlugin **execution order** is determined by declaration in the plugins section (**top-down**)\n\n```js\n{\n plugins: {\n 'postcss-plugin': {}, // [0]\n 'postcss-plugin': {}, // [1]\n 'postcss-plugin': {} // [2]\n }\n}\n```\n\n

Context

\n\nWhen using a `{Function}` (`postcss.config.js` or `.postcssrc.js`), it's possible to pass context to `postcss-load-config`, which will be evaluated while loading your config. By default `ctx.env (process.env.NODE_ENV)` and `ctx.cwd (process.cwd())` are available on the `ctx` `{Object}`\n\n> ℹ️ Most third-party integrations add additional properties to the `ctx` (e.g `postcss-loader`). Check the specific module's README for more information about what is available on the respective `ctx`\n\n

Examples

\n\n**postcss.config.js**\n\n```js\nmodule.exports = (ctx) => ({\n parser: ctx.parser ? 'sugarss' : false,\n map: ctx.env === 'development' ? ctx.map : false,\n plugins: {\n 'postcss-import': {},\n 'postcss-nested': {},\n cssnano: ctx.env === 'production' ? {} : false\n }\n})\n```\n\n
\n \n
\n\n```json\n\"scripts\": {\n \"build\": \"NODE_ENV=production node postcss\",\n \"start\": \"NODE_ENV=development node postcss\"\n}\n```\n\n```js\nconst { readFileSync } = require('fs')\n\nconst postcss = require('postcss')\nconst postcssrc = require('postcss-load-config')\n\nconst css = readFileSync('index.sss', 'utf8')\n\nconst ctx = { parser: true, map: 'inline' }\n\npostcssrc(ctx).then(({ plugins, options }) => {\n postcss(plugins)\n .process(css, options)\n .then((result) => console.log(result.css))\n})\n```\n\n
\n \n
\n\n```json\n\"scripts\": {\n \"build\": \"NODE_ENV=production gulp\",\n \"start\": \"NODE_ENV=development gulp\"\n}\n```\n\n```js\nconst { task, src, dest, series, watch } = require('gulp')\n\nconst postcss = require('gulp-postcssrc')\n\nconst css = () => {\n src('src/*.css')\n .pipe(postcss())\n .pipe(dest('dest'))\n})\n\ntask('watch', () => {\n watch(['src/*.css', 'postcss.config.js'], css)\n})\n\ntask('default', series(css, 'watch'))\n```\n\n
\n \n
\n\n```json\n\"scripts\": {\n \"build\": \"NODE_ENV=production webpack\",\n \"start\": \"NODE_ENV=development webpack-dev-server\"\n}\n```\n\n**webpack.config.js**\n```js\nmodule.exports = (env) => ({\n module: {\n rules: [\n {\n test: /\\.css$/,\n use: [\n 'style-loader',\n 'css-loader',\n 'postcss-loader'\n ]\n }\n ]\n }\n})\n```\n\n

Maintainers

\n\n\n \n \n \n \n \n \n
\n \n
\n Michael Ciniawsky\n 		\n \n
\n Mateusz Derks\n
\n\n

Contributors

\n\n\n \n \n \n \n \n \n \n \n\n\nPermission is hereby granted, free of charge, to any person obtaining a copy of\nthis software and associated documentation files (the \"Software\"), to deal in\nthe Software without restriction, including without limitation the rights to\nuse, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of\nthe Software, and to permit persons to whom the Software is furnished to do so,\nsubject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS\nFOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR\nCOPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER\nIN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN\nCONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.\n" }, "artifacts": [], "remote": { "resolved": "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-4.0.2.tgz#7159dcf626118d33e299f485d6afe4aff7c4a3e3", "type": "tarball", "reference": "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-4.0.2.tgz", "hash": "7159dcf626118d33e299f485d6afe4aff7c4a3e3", "integrity": "sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==", "registry": "npm", "packageName": "postcss-load-config", "cacheIntegrity": "sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ== sha1-cVnc9iYRjTPimfSF1q/kr/fEo+M=" }, "registry": "npm", "hash": "7159dcf626118d33e299f485d6afe4aff7c4a3e3" }
\n \n
\n Ryan Dunckel\n 		\n \n
\n Patrick Gilday\n 		\n \n
\n Dalton Santos\n 		\n \n
\n François Wouts\n