postcss 7.0.38 → 7.0.39

package/docs/architecture.md

@@ -1,156 +0,0 @@
-## PostCSS Architecture
-
-General overview of the PostCSS architecture.
-It can be useful for everyone who wishes to contribute to the core or develop a better understanding of the tool.
-
-**Table of Contents**
-
-- [Overview](#overview)
-- [Workflow](#workflow)
-- [Core Structures](#core-structures)
-    * [Tokenizer](#tokenizer--libtokenizees6-)
-    * [Parser](#parser--libparsees6-libparseres6-)
-    * [Processor](#processor--libprocessores6-)
-    * [Stringifier](#stringifier--libstringifyes6-libstringifieres6-)
-- [API](#api-reference)
-
-### Overview
-
-> This section describes ideas lying behind PostCSS
-
-Before diving deeper into the development of PostCSS let's briefly describe what is PostCSS and what is not.
-
-**PostCSS**
-
-- *is **NOT** a style preprocessor like `Sass` or `Less`.*
-
-    It does not define a custom syntax and semantics, it's not actually a language.
-    PostCSS works with CSS and can be easily integrated with the tools described above. That being said any valid CSS can be processed by PostCSS.
-
-- *is a tool for CSS syntax transformations*
-
-    It allows you to define custom CSS like syntax that could be understandable and transformed by plugins. That being said PostCSS is not strictly about CSS spec but about syntax definition manner of CSS. In such a way you can define custom syntax constructs like at-rule, that could be very helpful for tools build around PostCSS. PostCSS plays the role of a framework for building outstanding tools for CSS manipulations.
-
-- *is a big player in CSS ecosystem*
-
-    A Large amount of lovely tools like `Autoprefixer`, `Stylelint`, `CSSnano` were built on PostCSS ecosystem. There is a big chance that you already use it implicitly, just check your `node_modules` :smiley:
-
-### Workflow
-
-This is a high-level overview of the whole PostCSS workflow
-
-<img width="300" src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/aa/PostCSS_scheme.svg/512px-PostCSS_scheme.svg.png" alt="workflow">
-
-As you can see from the diagram above, PostCSS architecture is pretty straightforward but some parts of it could be misunderstood.
-
-You can see a part called *Parser*, this construct will be described in details later on, just for now think about it as a structure that can understand your CSS like syntax and create an object representation of it.
-
-That being said, there are few ways to write a parser.
-
- - *Write a single file with string to AST transformation*
-
-    This method is quite popular, for example, the [Rework analyzer](https://github.com/reworkcss/css/blob/master/lib/parse/index.js) was written in this style. But with a large code base, the code becomes hard to read and pretty slow.
-
- - *Split it into lexical analysis/parsing steps (source string → tokens → AST)*
-
-    This is the way of how we do it in PostCSS and also the most popular one.
-    A lot of parsers like [`@babel/parser` (parser behind Babel)](https://github.com/babel/babel/tree/master/packages/babel-parser), [`CSSTree`](https://github.com/csstree/csstree) were written in such way.
-    The main reasons to separate tokenization from parsing steps are performance and abstracting complexity.
-
-Let think about why the second way is better for our needs.
-
-First of all, because string to tokens step takes more time than parsing step. We operate on large source string and process it char by char, this is why it is very inefficient operation in terms of performance and we should perform it only once.
-
-But from other side tokens to AST transformation is logically more complex so with such separation we could write very fast tokenizer (but from this comes sometimes hard to read code) and easy to read (but slow) parser.
-
-Summing it up splitting into two steps improve performance and code readability.
-
-So now let's look more closely on structures that play the main role in PostCSS workflow.
-
-### Core Structures
-
- - #### Tokenizer ( [lib/tokenize.es6](https://github.com/postcss/postcss/blob/master/lib/tokenize.es6) )
-
-    Tokenizer (aka Lexer) plays important role in syntax analysis.
-
-    It accepts CSS string and returns a list of tokens.
-
-    Token is a simple structure that describes some part of syntax like `at-rule`, `comment` or `word`. It can also contain positional information for more descriptive errors.
-
-    For example, if we consider following CSS
-
-    ```css
-    .className { color: #FFF; }
-    ```
-
-    corresponding tokens from PostCSS will be
-    ```js
-    [
-        ["word", ".className", 1, 1, 1, 10]
-        ["space", " "]
-        ["{", "{", 1, 12]
-        ["space", " "]
-        ["word", "color", 1, 14, 1, 18]
-        [":", ":", 1, 19]
-        ["space", " "]
-        ["word", "#FFF" , 1, 21, 1, 23]
-        [";", ";", 1, 24]
-        ["space", " "]
-        ["}", "}", 1, 26]
-    ]
-    ```
-
-    As you can see from the example above a single token represented as a list and also `space` token doesn't have positional information.
-
-    Let's look more closely on single token like `word`. As it was said each token represented as a list and follow such pattern.
-
-    ```js
-    const token = [
-         // represents token type
-        'word',
-
-        // represents matched word
-        '.className',
-
-        // This two numbers represent start position of token.
-        // It is optional value as we saw in the example above,
-        // tokens like `space` don't have such information.
-
-        // Here the first number is line number and the second one is corresponding column.
-        1, 1,
-
-        // Next two numbers also optional and represent end position for multichar tokens like this one. Numbers follow same rule as was described above
-        1, 10
-    ]
-    ```
-   There are many patterns how tokenization could be done, PostCSS motto is performance and simplicity. Tokenization is a complex computing operation and takes a large amount of syntax analysis time ( ~90% ), that why PostCSS' Tokenizer looks dirty but it was optimized for speed. Any high-level constructs like classes could dramatically slow down tokenizer.
-
-    PostCSS' Tokenizer uses some sort of streaming/chaining API where you expose [`nextToken()`](https://github.com/postcss/postcss/blob/master/lib/tokenize.es6#L48-L308) method to Parser. In this manner, we provide a clean interface for Parser and reduce memory usage by storing only a few tokens and not the whole list of tokens.
-
-- #### Parser ( [lib/parse.es6](https://github.com/postcss/postcss/blob/master/lib/parse.es6), [lib/parser.es6](https://github.com/postcss/postcss/blob/master/lib/parser.es6) )
-
-    Parser is the main structure responsible for [syntax analysis](https://en.wikipedia.org/wiki/Parsing) of incoming CSS. Parser produces a structure called [Abstract Syntax Tree (AST)](https://en.wikipedia.org/wiki/Abstract_syntax_tree) that could then be transformed by plugins later on.
-
-    Parser works in common with Tokenizer and operates over tokens, not source string, as it would be a very inefficient operation.
-
-    It uses mostly `nextToken` and `back` methods provided by Tokenizer for obtaining single or multiple tokens and then construct part of AST called `Node`.
-
-    There are multiple Node types that PostCSS could produce but all of them inherit from base Node [class](https://github.com/postcss/postcss/blob/master/lib/node.es6#L34).
-
-- #### Processor ( [lib/processor.es6](https://github.com/postcss/postcss/blob/master/lib/processor.es6) )
-
-    Processor is a very plain structure that initializes plugins and runs syntax transformations. Plugin is just a function registered with [postcss.plugin](https://github.com/postcss/postcss/blob/master/lib/postcss.es6#L109) call.
-
-    It exposes only a few public API methods. Description of them could be found on [api.postcss.org/Processor](http://api.postcss.org/Processor.html)
-
-- #### Stringifier ( [lib/stringify.es6](https://github.com/postcss/postcss/blob/master/lib/stringify.es6), [lib/stringifier.es6](https://github.com/postcss/postcss/blob/master/lib/stringifier.es6) )
-
-    Stringifier is a base class that translates modified AST to pure CSS string. Stringifier traverses AST starting from provided Node and generates a raw string representation of it calling corresponding methods.
-
-    The most essential method is [`Stringifier.stringify`](https://github.com/postcss/postcss/blob/master/lib/stringifier.es6#L25-L27)
-    that accepts initial Node and semicolon indicator.
-    You can learn more by checking [stringifier.es6](https://github.com/postcss/postcss/blob/master/lib/stringifier.es6)
-
-### API Reference
-
-More descriptive API documentation could be found [here](http://api.postcss.org/)

package/docs/guidelines/plugin.md

@@ -1,195 +0,0 @@
-# PostCSS Plugin Guidelines
-
-A PostCSS plugin is a function that receives and, usually,
-transforms a CSS AST from the PostCSS parser.
-
-The rules below are *mandatory* for all PostCSS plugins.
-
-See also [ClojureWerkz’s recommendations] for open source projects.
-
-[ClojureWerkz’s recommendations]:  http://blog.clojurewerkz.org/blog/2013/04/20/how-to-make-your-open-source-project-really-awesome/
-
-## 1. API
-
-### 1.1 Clear name with `postcss-` prefix
-
-The plugin’s purpose should be clear just by reading its name.
-If you wrote a transpiler for CSS 4 Custom Media, `postcss-custom-media`
-would be a good name. If you wrote a plugin to support mixins,
-`postcss-mixins` would be a good name.
-
-The prefix `postcss-` shows that the plugin is part of the PostCSS ecosystem.
-
-This rule is not mandatory for plugins that can run as independent tools,
-without the user necessarily knowing that it is powered by
-PostCSS — for example, [RTLCSS] and [Autoprefixer].
-
-[Autoprefixer]: https://github.com/postcss/autoprefixer
-[RTLCSS]:       https://rtlcss.com/
-
-### 1.2. Do one thing, and do it well
-
-Do not create multitool plugins. Several small, one-purpose plugins bundled into
-a plugin pack is usually a better solution.
-
-For example, [`postcss-preset-env`] contains many small plugins,
-one for each W3C specification. And [`cssnano`] contains a separate plugin
-for each of its optimization.
-
-[`postcss-preset-env`]: https://preset-env.cssdb.org/
-[`cssnano`]:            https://github.com/ben-eb/cssnano
-
-### 1.3. Do not use mixins
-
-Preprocessors libraries like Compass provide an API with mixins.
-
-PostCSS plugins are different.
-A plugin cannot be just a set of mixins for [`postcss-mixins`].
-
-To achieve your goal, consider transforming valid CSS
-or using custom at-rules and custom properties.
-
-[`postcss-mixins`]: https://github.com/postcss/postcss-mixins
-
-### 1.4. Create plugin by `postcss.plugin`
-
-By wrapping your function in this method,
-you are hooking into a common plugin API:
-
-```js
-module.exports = postcss.plugin('plugin-name', opts => {
-  return (root, result) => {
-    // Plugin code
-  }
-})
-```
-
-## 2. Processing
-
-### 2.1. Plugin must be tested
-
-A CI service like [Travis] is also recommended for testing code in
-different environments. You should test in (at least) Node.js [active LTS](https://github.com/nodejs/LTS) and current stable version.
-
-[Travis]: https://travis-ci.org/
-
-### 2.2. Use asynchronous methods whenever possible
-
-For example, use `fs.writeFile` instead of `fs.writeFileSync`:
-
-```js
-postcss.plugin('plugin-sprite', opts => {
-  return (root, result) => {
-
-    return new Promise((resolve, reject) => {
-      const sprite = makeSprite()
-      fs.writeFile(opts.file, sprite, err => {
-        if (err) return reject(err)
-        resolve()
-      })
-    })
-
-  }
-})
-```
-
-### 2.3. Set `node.source` for new nodes
-
-Every node must have a relevant `source` so PostCSS can generate
-an accurate source map.
-
-So if you add a new declaration based on some existing declaration, you should
-clone the existing declaration in order to save that original `source`.
-
-```js
-if (needPrefix(decl.prop)) {
-  decl.cloneBefore({ prop: '-webkit-' + decl.prop })
-}
-```
-
-You can also set `source` directly, copying from some existing node:
-
-```js
-if (decl.prop === 'animation') {
-  const keyframe = createAnimationByName(decl.value)
-  keyframes.source = decl.source
-  decl.root().append(keyframes)
-}
-```
-
-### 2.4. Use only the public PostCSS API
-
-PostCSS plugins must not rely on undocumented properties or methods,
-which may be subject to change in any minor release. The public API
-is described in [API docs].
-
-[API docs]: http://api.postcss.org/
-
-## 3. Errors
-
-### 3.1. Use `node.error` on CSS relevant errors
-
-If you have an error because of input CSS (like an unknown name
-in a mixin plugin) you should use `node.error` to create an error
-that includes source position:
-
-```js
-if (typeof mixins[name] === 'undefined') {
-  throw decl.error('Unknown mixin ' + name, { plugin: 'postcss-mixins' })
-}
-```
-
-### 3.2. Use `result.warn` for warnings
-
-Do not print warnings with `console.log` or `console.warn`,
-because some PostCSS runner may not allow console output.
-
-```js
-if (outdated(decl.prop)) {
-  result.warn(decl.prop + ' is outdated', { node: decl })
-}
-```
-
-If CSS input is a source of the warning, the plugin must set the `node` option.
-
-## 4. Documentation
-
-### 4.1. Document your plugin in English
-
-PostCSS plugins must have their `README.md` wrote in English. Do not be afraid
-of your English skills, as the open source community will fix your errors.
-
-Of course, you are welcome to write documentation in other languages;
-just name them appropriately (e.g. `README.ja.md`).
-
-### 4.2. Include input and output examples
-
-The plugin's `README.md` must contain example input and output CSS.
-A clear example is the best way to describe how your plugin works.
-
-The first section of the `README.md` is a good place to put examples.
-See [postcss-opacity](https://github.com/iamvdo/postcss-opacity) for an example.
-
-Of course, this guideline does not apply if your plugin does not
-transform the CSS.
-
-### 4.3. Maintain a changelog
-
-PostCSS plugins must describe the changes of all their releases
-in a separate file, such as `CHANGELOG.md`, `History.md`, or [GitHub Releases].
-Visit [Keep A Changelog] for more information about how to write one of these.
-
-Of course, you should be using [SemVer].
-
-[Keep A Changelog]: http://keepachangelog.com/
-[GitHub Releases]:  https://help.github.com/articles/creating-releases/
-[SemVer]:           http://semver.org/
-
-### 4.4. Include `postcss-plugin` keyword in `package.json`
-
-PostCSS plugins written for npm must have the `postcss-plugin` keyword
-in their `package.json`. This special keyword will be useful for feedback about
-the PostCSS ecosystem.
-
-For packages not published to npm, this is not mandatory, but is recommended
-if the package format can contain keywords.

package/docs/guidelines/runner.md

@@ -1,143 +0,0 @@
-# PostCSS Runner Guidelines
-
-A PostCSS runner is a tool that processes CSS through a user-defined list
-of plugins; for example, [`postcss-cli`] or [`gulp‑postcss`].
-These rules are mandatory for any such runners.
-
-For single-plugin tools, like [`gulp-autoprefixer`],
-these rules are not mandatory but are highly recommended.
-
-See also [ClojureWerkz’s recommendations] for open source projects.
-
-[ClojureWerkz’s recommendations]:  http://blog.clojurewerkz.org/blog/2013/04/20/how-to-make-your-open-source-project-really-awesome/
-[`gulp-autoprefixer`]: https://github.com/sindresorhus/gulp-autoprefixer
-[`gulp‑postcss`]:      https://github.com/w0rm/gulp-postcss
-[`postcss-cli`]:       https://github.com/postcss/postcss-cli
-
-## 1. API
-
-### 1.1. Accept functions in plugin parameters
-
-If your runner uses a config file, it must be written in JavaScript, so that
-it can support plugins which accept a function, such as [`postcss-assets`]:
-
-```js
-module.exports = [
-  require('postcss-assets')({
-    cachebuster: function (file) {
-      return fs.statSync(file).mtime.getTime().toString(16)
-    }
-  })
-]
-```
-
-[`postcss-assets`]: https://github.com/borodean/postcss-assets
-
-## 2. Processing
-
-### 2.1. Set `from` and `to` processing options
-
-To ensure that PostCSS generates source maps and displays better syntax errors,
-runners must specify the `from` and `to` options. If your runner does not handle
-writing to disk (for example, a gulp transform), you should set both options
-to point to the same file:
-
-```js
-processor.process({ from: file.path, to: file.path })
-```
-
-### 2.2. Use only the asynchronous API
-
-PostCSS runners must use only the asynchronous API.
-The synchronous API is provided only for debugging, is slower,
-and can’t work with asynchronous plugins.
-
-```js
-processor.process(opts).then(result => {
-  // processing is finished
-});
-```
-
-### 2.3. Use only the public PostCSS API
-
-PostCSS runners must not rely on undocumented properties or methods,
-which may be subject to change in any minor release. The public API
-is described in [API docs].
-
-[API docs]: http://api.postcss.org/
-
-## 3. Output
-
-### 3.1. Don’t show JS stack for `CssSyntaxError`
-
-PostCSS runners must not show a stack trace for CSS syntax errors,
-as the runner can be used by developers who are not familiar with JavaScript.
-Instead, handle such errors gracefully:
-
-```js
-processor.process(opts).catch(error => {
-  if (error.name === 'CssSyntaxError') {
-    process.stderr.write(error.message + error.showSourceCode())
-  } else {
-    throw error
-  }
-})
-```
-
-### 3.2. Display `result.warnings()`
-
-PostCSS runners must output warnings from `result.warnings()`:
-
-```js
-result.warnings().forEach(warn => {
-  process.stderr.write(warn.toString())
-})
-```
-
-See also [postcss-log-warnings] and [postcss-messages] plugins.
-
-[postcss-log-warnings]: https://github.com/davidtheclark/postcss-log-warnings
-[postcss-messages]:     https://github.com/postcss/postcss-messages
-
-### 3.3. Allow the user to write source maps to different files
-
-PostCSS by default will inline source maps in the generated file; however,
-PostCSS runners must provide an option to save the source map in a different
-file:
-
-```js
-if (result.map) {
-  fs.writeFile(opts.to + '.map', result.map.toString())
-}
-```
-
-## 4. Documentation
-
-### 4.1. Document your runner in English
-
-PostCSS runners must have their `README.md` wrote in English. Do not be afraid
-of your English skills, as the open source community will fix your errors.
-
-Of course, you are welcome to write documentation in other languages;
-just name them appropriately (e.g. `README.ja.md`).
-
-### 4.2. Maintain a changelog
-
-PostCSS runners must describe changes of all releases in a separate file,
-such as `ChangeLog.md`, `History.md`, or with [GitHub Releases].
-Visit [Keep A Changelog] for more information on how to write one of these.
-
-Of course, you should use [SemVer].
-
-[Keep A Changelog]: http://keepachangelog.com/
-[GitHub Releases]:  https://help.github.com/articles/creating-releases/
-[SemVer]:           http://semver.org/
-
-### 4.3. `postcss-runner` keyword in `package.json`
-
-PostCSS runners written for npm must have the `postcss-runner` keyword
-in their `package.json`. This special keyword will be useful for feedback about
-the PostCSS ecosystem.
-
-For packages not published to npm, this is not mandatory, but recommended
-if the package format is allowed to contain keywords.

package/docs/source-maps.md

@@ -1,74 +0,0 @@
-# PostCSS and Source Maps
-
-PostCSS has great [source maps] support. It can read and interpret maps
-from previous transformation steps, autodetect the format that you expect,
-and output both external and inline maps.
-
-To ensure that you generate an accurate source map, you must indicate the input
-and output CSS file paths — using the options `from` and `to`, respectively.
-
-To generate a new source map with the default options, simply set `map: true`.
-This will generate an inline source map that contains the source content.
-If you don’t want the map inlined, you can set `map.inline: false`.
-
-```js
-processor
-  .process(css, {
-    from: 'app.sass.css',
-    to:   'app.css',
-    map: { inline: false }
-  })
-  .then(result => {
-      result.map //=> '{ "version":3,
-                 //      "file":"app.css",
-                 //      "sources":["app.sass"],
-                 //       "mappings":"AAAA,KAAI" }'
-  })
-```
-
-If PostCSS finds source maps from a previous transformation,
-it will automatically update that source map with the same options.
-
-## Options
-
-If you want more control over source map generation, you can define the `map`
-option as an object with the following parameters:
-
-* `inline` boolean: indicates that the source map should be embedded
-  in the output CSS as a Base64-encoded comment. By default, it is `true`.
-  But if all previous maps are external, not inline, PostCSS will not embed
-  the map even if you do not set this option.
-
-  If you have an inline source map, the `result.map` property will be empty,
-  as the source map will be contained within the text of `result.css`.
-
-* `prev` string, object, boolean or function: source map content from
-  a previous processing step (for example, Sass compilation).
-  PostCSS will try to read the previous source map automatically
-  (based on comments within the source CSS), but you can use this option
-  to identify it manually. If desired, you can omit the previous map
-  with `prev: false`.
-
-* `sourcesContent` boolean: indicates that PostCSS should set the origin
-  content (for example, Sass source) of the source map. By default,
-  it is `true`. But if all previous maps do not contain sources content,
-  PostCSS will also leave it out even if you do not set this option.
-
-* `annotation` boolean or string: indicates that PostCSS should add annotation
-  comments to the CSS. By default, PostCSS will always add a comment with a path
-  to the source map. PostCSS will not add annotations to CSS files that
-  do not contain any comments.
-
-  By default, PostCSS presumes that you want to save the source map as
-  `opts.to + '.map'` and will use this path in the annotation comment.
-  A different path can be set by providing a string value for `annotation`.
-
-  If you have set `inline: true`, annotation cannot be disabled.
-
-* `from` string: by default, PostCSS will set the `sources` property of the map
-  to the value of the `from` option. If you want to override this behaviour, you
-  can use `map.from` to explicitly set the source map's `sources` property.
-  Path should be absolute or relative from generated file
-  (`to` option in `process()` method).
-
-[source maps]: http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/