chore(deps): update dependency postcss to v8 #47

PostCSS 8.4 brought ranges for warnings and errors, smaller node_modules size, lazy parsing to avoid PostCSS does nothing warning, and TypeScript fixes.

Thanks to Sponsors

This release was possible thanks to our community.

If your company wants to support the sustainability of front-end infrastructure or wants to give some love to PostCSS, you can join our supporters by:

Tidelift with a Spotify-like subscription model supporting all projects from your lock file.
Direct donations in PostCSS & Autoprefixer Open Collective.

Rages for Errors and Warnings

@adalinesimonian, the author of amazing Stylelint extension for VS Code, added ranges to errors and warnings.

result.warn(msg, { index })           // One character warning at index
result.warn(msg, { endIndex })        // Starts at node start, ends at endIndex
result.warn(msg, { index, endIndex }) // Starts at index, ends at endIndex
result.warn(msg, { start })           // Starts at start, ends at node end
result.warn(msg, { end })             // Starts at node start, ends at end
result.warn(msg, { start, end })      // Starts at start, ends at end
result.warn(msg, { word })            // Starts at word location, ends at word index + length

It will improve DX in the IDE extension.

Lazy Parsing

Previously, we found that many tools run PostCSS even if the developer didn’t pass any PostCSS plugins. Parsing is the most expensive step in CSS processing. It led to a waste of resources without any reason.

We tried to resolve the problem by adding a PostCSS does nothing warning. But it didn’t force tool authors to be more careful with user’s resources.

If PostCSS sees that tool call it without passing plugins (or changing parser/stringifier), PostCSS will not parse CSS (until toll will call Result#root). In 8.4, @bogdan0083 (with the help of @WilhelmYakunin) tries to solve the problem in another way. It allows us to save resources and remove the PostCSS does nothing warning.

// No plugins, we do not parse CSS
let result = await postcss().process(css, { from  })
result.css  // Is the same string passed to process()
result.map  // Special 1-to-1 source map
result.root // CSS will parsed only here

Install Size Reduction

With ≈60M weekly downloads, PostCSS has responsibility for the world’s resource spending.

Together with @7rulnik we reduced source-map-js size. It is transitive dependency of PostCSS.

In 8.4, we moved to a fixed version of source-map-js, which reduced the postcss size in your node_modules from ≈1 MB to 0.3 MB. With the huge popularity of PostCSS, it will free a lot of resources on our CIs.

Migration from Jest to `uvu`

@kimoofey refactored all tests from the popular Jest framework to small and fast uvu.

It will not affect end-users. However, it reduced our node_modules size by 33 MB and made tests twice faster (yarn install & yarn unit: 24 → 13 seconds).

TypeScript Fixes

Added Processor types.
Added Stringifier types (by @43081j).
Fixed types Root and Document in result values (by @43081j).
Fixed Node#walkRules() types (by @hudochenkov).

Other Changes

Fixed docs (by @paulshryock).

`v8.3.11`

Compare Source

Remove debugging code.

`v8.3.10`

Compare Source

Fixed Maximum call stack issue of some source maps (by Yeting Li).

`v8.3.9`

Compare Source

Replaced nanocolors to picocolors.
Reduced package size.

`v8.3.8`

Compare Source

Update nanocolors.

`v8.3.7`

Compare Source

Replaced colorette to nanocolors.
Added bug field to package.json (by Christian Oliff).
Improved docs (by Andrew Bruce and Paul Shryock).

`v8.3.6`

Compare Source

Fixed column in missed semicolon error (by @Gusted).

`v8.3.5`

Compare Source

Fixed broken AST detection.

`v8.3.4`

Compare Source

Fixed broken AST detection.

`v8.3.3`

Compare Source

Fixed broken AST on postcss dependency duplication in custom parsers.

`v8.3.2`

Compare Source

Update changelog.

`v8.3.1`

Compare Source

Remove debugging code.

`v8.3.0`: 8.3 “Duke Murmur”

Compare Source

PostCSS 8.3 improved source map parsing performance, added Node#assign() shortcut, and experimental Document node to AST.

Thanks to Sponsors

This release was possible thanks to our community.

If your company wants to support the sustainability of front-end infrastructure or wants to give some love to PostCSS, you can join our supporters by:

Tidelift with a Spotify-like subscription model supporting all projects from your lock file.
Direct donations in PostCSS & Autoprefixer Open Collective.

Source Map Performance

Because PostCSS needs synchronous API, we can’t move from the old `source-map 0.6 to 0.7 (many other open-source projects too).

@7rulnik forked source-map 0.6 to source-map-js and back-ported performance improvements from 0.7. In 8.3 we switched from source-map to this source-map-js fork.

You map see 4x performance improvements in parsing map from processing step before PostCSS (for instance, Sass).

`Document` Nodes

Thanks to @gucong3000, PostCSS already parse CSS from HTML and JS files (CSS-in-JS templates and objects).

But his plugin need big updates. @hudochenkov from stylelint team decided to create new parsers for styles inside CSS-in-JS, HTML, and Markdown.

He suggested adding new Document node type to PostCSS AST to keep multiple Root nodes inside and JS/HTML/Markdown code blocks between these style blocks.

const document = htmlParser(
  '<html><style>a{color:black}</style><style>b{z-index:2}</style>'
)
document.type          //=> 'document'
document.nodes.length  //=> 2
document.nodes[0].type //=> 'root'

This is an experimental feature. Some aspects of this node could change within minor or patch version releases.

`Node#assign()` Shortcut

The creator of famous postcss-preset-env and many other PostCSS tools, @jonathantneal suggested a nice shortcut to change multiple properties in the node:

decl.assign({ prop: 'word-wrap', value: 'break-word' })

`v8.2.15`

Compare Source

Fixed list type definitions (by @n19htz).

`v8.2.14`

Compare Source

Removed source-map from client-side bundle (by Barak Igal).

`v8.2.13`

Compare Source

Fixed ReDoS vulnerabilities in source map parsing (by Yeting Li).

`v8.2.12`

Compare Source

Fixed package.json exports.

`v8.2.11`

Compare Source

Fixed DEP0148 warning in Node.js 16.
Fixed docs (by @semiromid).

`v8.2.10`

Compare Source

Fixed ReDoS vulnerabilities in source map parsing.
Fixed webpack 5 support (by Barak Igal).
Fixed docs (by Roeland Moors).

`v8.2.9`

Compare Source

Exported NodeErrorOptions type (by Rouven Weßling).

`v8.2.8`

Compare Source

Fixed browser builds in webpack 4 (by Matt Jones).

`v8.2.7`

Compare Source

Fixed browser builds in webpack 5 (by Matt Jones).

`v8.2.6`

Compare Source

Fixed Maximum call stack size exceeded in Node#toJSON.
Fixed docs (by inokawa).

`v8.2.5`

Compare Source

Fixed escaped characters handling in list.split (by Natalie Weizenbaum).

`v8.2.4`

Compare Source

Added plugin name to postcss.plugin() warning (by Tom Williams).
Fixed docs (by Bill Columbia).

`v8.2.3`

Compare Source

Fixed JSON.stringify(Node[]) support (by Niklas Mischkulnig).

`v8.2.2`

Compare Source

Fixed CSS-in-JS support (by James Garbutt).
Fixed plugin types (by Ludovico Fischer).
Fixed Result#warn() types.

`v8.2.1`

Compare Source

Fixed list type definitions (by @n19htz).

`v8.2.0`: 8.2 “Prince Orobas”

Compare Source

PostCSS 8.2 added a new API to serialize and deserialize CSS AST to JSON.

import { parse, fromJSON } from 'postcss'

let root = parse('a{}', { from: 'input.css' })
let json = root.toJSON()
// save to file, send by network, etc
let root2 = fromJSON(json)

Thanks to @mischnic for his work.

`v8.1.14`

Compare Source

Fixed parser performance regression.

`v8.1.13`

Compare Source

Fixed broken AST after moving nodes in visitor API.

`v8.1.12`

Compare Source

Fixed Autoprefixer regression.

`v8.1.11`

Compare Source

Added PostCSS update suggestion on unknown event in plugin.

`v8.1.10`

Compare Source

Fixed LazyResult type export (by Evan You).
Fixed LazyResult type compatibility with Promise (by Anton Kastritskiy).

`v8.1.9`

Compare Source

Reduced dependencies number (by Bogdan Chadkin).

`v8.1.8`

Compare Source

Fixed LazyResult type compatibility with Promise (by Ludovico Fischer).
Fixed HTTPS links in documentation.

`v8.1.7`

Compare Source

Fixed import support in TypeScript (by Remco Haszing).

`v8.1.6`

Compare Source

Reverted package.exports Node.js 15 fix.

`v8.1.5`

Compare Source

Fixed Node.js 15 warning (by 沈鸿飞).

`v8.1.4`

Compare Source

Fixed TypeScript definition (by Arthur Petrie).

`v8.1.3`

Compare Source

Added package.types.

`v8.1.2`

Compare Source

Fixed API docs (by Arthur Petrie).
Improved plugin guide (by Yunus Gaziev).
Prepared code base for Deno support (by Oscar Otero).

`v8.1.1`

Compare Source

Fixed parser performance regression.

`v8.1.0`: 8.1 “Duke Gemory”

Compare Source

PostCSS 8.1 fixed the new visitor API from the 8.0 release.

We fixed Root and RootExit re-calling on children's changes. And now visitors will visit the parent again if nested children were changed.

We added Once and OnceExit events, which will not be called again on node changes. You can use them to lint files or collect statistics:

module.exports = {
  postcssPlugin: 'postcss-linter',
  OnceExit (root) {
    lint(root)
  }
}
module.exports.postcss = true

We updated Migration guide according to new changes.

`v8.0.9`

Compare Source

Replace prototype in PostCSS 7 nodes instead of recreating them.
Added missed Transformer to exported types (by Pierre-Marie Dartus).

`v8.0.8`

Compare Source

Fix 8.0.7 regression on PostCSS 7 nodes converting (by Adam Wathan).

`v8.0.7`

Compare Source

Fixed compatibility issue with mixin AST with PostCSS 7 and 8 nodes.
Added migration guide translation to Chinese to the warning.

`v8.0.6`

Compare Source

Fixed child adding methods in Container.

`v8.0.5`

Compare Source

Update changelog.

`v8.0.4`

Compare Source

Fixed Cannot read property 'line' of null error.
Fixed source map support for declarations.

`v8.0.3`

Compare Source

Fixed client-side bundling support.

`v8.0.2`

Compare Source

Fixed plugin packs support.

`v8.0.1`

Compare Source

Updated Processor#version.

`v8.0.0`: 8.0 “President Ose”

Compare Source

PostCSS 8.0 brings new plugin API, node_modules size reduction, better source map support, and CSS parser improvements.

Check out a day-by-day diary of PostCSS 8.0 development process.

See Migration Guides for end-users and for plugin developers.

Thanks to Sponsors

With more than 100 M downloads per month, it becomes hard to support PostCSS in free time. For instance, getting the 8.0 release ready took 4 months of work.

This release was possible thanks to out community. Tailwind CSS, De Voorhoede, InVision AG, Brainbow, and many individual contributions.

If your company wants to support the sustainability of front-end infrastructure or just wants to give some love to PostCSS, you can join our supporters by:

Tidelift with a Spotify-like subscription model and supporting all projects from your lock file.
Direct donations in PostCSS & Autoprefixer Open Collective.

Breaking Changes

We try to avoid any breaking changes for end-users:

PostCSS 8 dropped Node.js 6.x, 8.x, 11.x, and 13.x versions support. All these versions have no security updates anymore.
We now serve ES6+ sources in the npm package without Babel compilation. If you are creating tools like CodePen and put PostCSS into the client-side JS bundle, you may need to run Babel on node_modules/postcss for old browsers.
We removed rarely used postcss.vendor API.

New Plugin API

The biggest change in PostCSS 8 is a new plugin API. Thanks to @BondarenkoAlex for big help in creating a new API.

module.exports = () => {
  return {
    postcssPlugin: 'postcss-will-change',
    Declaration: {
      'will-change': (decl, { Declaration }) => {
        decl.cloneBefore(
          new Declaration({ prop: 'backface-visibility', value: 'hidden' })
        )
      }
    }
  }
}
module.exports.postcss = true

We know that rewriting old plugins will take time, but the new API will improve the end-user’s experience and make life easier for plugin developers:

With new API, all plugins can share a single scan of the CSS tree. It makes CSS processing up to 20% faster.
Because npm often duplicates dependencies, you may have many postcss duplicates in your node_modules. New API fixes this problem.
Plugins will re-visit changed nodes to reduce compatibility issues between plugins. Now the order of plugins in your PostCSS config will be less important.
New API is close to Babel’s visitor API.

These resources will help plugin developers in API migration:

The Migration Guide
Writing a PostCSS Plugin
We have a Gitter chat open for all questions related to plugin migration.

PostCSS development guidelines were also changed:

Now it is prohibited to create own AST on top of PostCSS AST classes since it could lead to painful bugs due to the usage private APIs.
Plugins and runners must have postcss in peerDependencies.

New Website without React

Previously PostCSS used a React-based framework for the project's website. Since we have a static website, we decided to migrate to a React-free framework and got good performance improvements:

360 → 20 ms for Max Potential First Input Delay
3.3 → 1.5 seconds for First CPU Idle
3.3 → 1.5 seconds for Time to Interactive

Check out postcss.org and new API docs that feature the awesome alchemy-inspired design by @okonet.

We also removed Google Analytics tracking scripts and encourage other open source projects to be an example in caring about user’s privacy and performance.

Parser Improvments

Did you know that all examples below are valid CSS?

:root {
  --empty: ;
  --JSON: [1, "2", {"three": {"a":1}}, [4]];
  --javascript: function(rule) { console.log(rule) };
}

@&#8203;supports (--element(".minwidth", { "minWidth": 300 })) {
  [--self] {
    background: greenyellow;
  }
}

Now PostCSS parses even those rare edge cases correctly. Thanks to Tailwind CSS and Prettier teams for adding more cases to our CSS parser tests collection.

Note that now --roundMixin: { border-radius: 8px } will be parsed as a Declaration with the { border-radius: 8px } value.

Better Source Map Support

We have added support for two new source map formats: Index map and JSON (data:application/json).

PostCSS 8 is now much closer to the source map spec. Thanks to the Google team for reports:

We now treat sources in map as URLs instead of file paths.
We now resolve sources relative to map file, not CSS file.

A few source map APIs were added:

opts.maps.absolute = true option for absolute paths in source map.
opts.maps.annotation = (file, root) => url for a dynamic path to source map.
Node#origin() now returns position.url in addition to position.file for compatibility with absolute URLs in source map’s sources.

API Changes

We have added ES modules support and now we export all classes from the main entry:

import { CssSyntaxError, parse } from "postcss"

@graberzz added Node#source.offset in addition to line and column.

CSS Custom Properties and Sass-like $-variables now have a special Declaration#variable mark:

const root = parse(`
  :root {
    --propery: value;
  }
  $variable: value
`)

root.first.first.variable //=> true
root.last.variable //=> true

TypeScript

PostCSS now has a first-class TypeScript support:

We moved API docs from JSDoc to TypeDoc. Check out our new API docs.
We are using check-dts to test types with special unit tests.
We keep types in separate files for better readability.
With the new structure and test system, we fixed many small issues in types.

Other Changes

Fixed calling replaceWith with input replaced node (by @josephkaptur).
Reduce dependencies by replacing chalk to colorette.
Added Declaration#value auto-conversion to string to prevent plugin’s bugs.
Fixed building PostCSS with Rollup (by @MapGrid) because of circular dependencies.
Moved unknown source from counter to random IDs: <input css 9M4X8l>:10:6.
Removed docs from the npm package.

Configuration

📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.

♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

🔕 Ignore: Close this PR and you won't be reminded about this update again.

If you want to rebase/retry this PR, check this box

This PR was generated by Mend Renovate. View the repository job log.

renovate bot force-pushed the renovate/postcss-8.x branch from cd6ee11 to c9b30ab Compare November 16, 2021 21:54

renovate bot force-pushed the renovate/postcss-8.x branch 4 times, most recently from 00bc178 to 78ab098 Compare November 27, 2021 15:53

renovate bot force-pushed the renovate/postcss-8.x branch from 78ab098 to 07898cf Compare December 13, 2021 02:25

renovate bot force-pushed the renovate/postcss-8.x branch from 07898cf to 2b6fb2d Compare February 1, 2022 13:48

renovate bot force-pushed the renovate/postcss-8.x branch from 2b6fb2d to 109568e Compare February 24, 2022 23:58

renovate bot force-pushed the renovate/postcss-8.x branch from 109568e to 20be791 Compare March 7, 2022 02:56

renovate bot force-pushed the renovate/postcss-8.x branch from 20be791 to 30a3624 Compare March 26, 2022 15:13

renovate bot changed the title ~~Update dependency postcss to v8~~ chore(deps): update dependency postcss to v8 Mar 26, 2022

renovate bot force-pushed the renovate/postcss-8.x branch from 30a3624 to b02f67c Compare May 15, 2022 21:20

renovate bot force-pushed the renovate/postcss-8.x branch from b02f67c to 92ecb2d Compare June 18, 2022 19:38

renovate bot force-pushed the renovate/postcss-8.x branch from 92ecb2d to 20d80e6 Compare September 25, 2022 13:22

renovate bot force-pushed the renovate/postcss-8.x branch from 20d80e6 to b68e59c Compare November 20, 2022 07:57

renovate bot force-pushed the renovate/postcss-8.x branch from b68e59c to 18ff353 Compare March 17, 2023 04:09

renovate bot force-pushed the renovate/postcss-8.x branch from 18ff353 to 68e832b Compare April 17, 2023 10:24

renovate bot force-pushed the renovate/postcss-8.x branch from 68e832b to 9523951 Compare May 28, 2023 11:31

renovate bot force-pushed the renovate/postcss-8.x branch from 9523951 to f520fcc Compare July 6, 2023 13:40

renovate bot force-pushed the renovate/postcss-8.x branch from f520fcc to aab2d6b Compare July 13, 2023 22:53

renovate bot force-pushed the renovate/postcss-8.x branch from aab2d6b to 7c60457 Compare July 21, 2023 13:38

renovate bot force-pushed the renovate/postcss-8.x branch from 7c60457 to 9d82855 Compare August 15, 2023 19:32

renovate bot force-pushed the renovate/postcss-8.x branch from 9d82855 to 7a33ed3 Compare August 29, 2023 18:29

renovate bot force-pushed the renovate/postcss-8.x branch from 7a33ed3 to dc792f5 Compare September 18, 2023 22:16

renovate bot force-pushed the renovate/postcss-8.x branch from dc792f5 to 5e8f405 Compare September 29, 2023 02:05

renovate bot force-pushed the renovate/postcss-8.x branch from 5e8f405 to e3b1fff Compare December 2, 2023 04:24

renovate bot force-pushed the renovate/postcss-8.x branch from e3b1fff to 9bb7ff0 Compare January 4, 2024 19:41

renovate bot force-pushed the renovate/postcss-8.x branch 2 times, most recently from 51f6c12 to bef84b9 Compare February 7, 2024 18:37

renovate bot force-pushed the renovate/postcss-8.x branch from bef84b9 to 2c9150b Compare March 17, 2024 23:07

renovate bot force-pushed the renovate/postcss-8.x branch 2 times, most recently from 790d5b6 to 66187ec Compare March 21, 2024 01:24

renovate bot force-pushed the renovate/postcss-8.x branch from 66187ec to e09a1c4 Compare June 29, 2024 18:43

renovate bot force-pushed the renovate/postcss-8.x branch from e09a1c4 to 9faad33 Compare July 24, 2024 22:47

renovate bot force-pushed the renovate/postcss-8.x branch from 9faad33 to 11c920c Compare August 5, 2024 23:31

renovate bot force-pushed the renovate/postcss-8.x branch 4 times, most recently from b4b64e4 to 1dbc0a2 Compare September 4, 2024 12:49

renovate bot force-pushed the renovate/postcss-8.x branch from 1dbc0a2 to 02359fb Compare September 14, 2024 15:14

renovate bot force-pushed the renovate/postcss-8.x branch from 02359fb to eef810b Compare November 10, 2024 22:00

chore(deps): update dependency postcss to v8

30c5305

renovate bot force-pushed the renovate/postcss-8.x branch from eef810b to 30c5305 Compare November 11, 2024 20:03

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

chore(deps): update dependency postcss to v8 #47

chore(deps): update dependency postcss to v8 #47

renovate bot commented Nov 16, 2021 •

edited

Loading

chore(deps): update dependency postcss to v8 #47

Are you sure you want to change the base?

chore(deps): update dependency postcss to v8 #47

Conversation

renovate bot commented Nov 16, 2021 • edited Loading

Release Notes

v8.4.0: 8.4 “President Camio”

Thanks to Sponsors

Rages for Errors and Warnings

Lazy Parsing

Install Size Reduction

Migration from Jest to uvu

TypeScript Fixes

Other Changes

v8.3.0: 8.3 “Duke Murmur”

Thanks to Sponsors

Source Map Performance

Document Nodes

Node#assign() Shortcut

v8.2.0: 8.2 “Prince Orobas”

v8.1.0: 8.1 “Duke Gemory”

v8.0.0: 8.0 “President Ose”

Thanks to Sponsors

Breaking Changes

New Plugin API

New Website without React

Parser Improvments

Better Source Map Support

API Changes

TypeScript

Other Changes

Configuration

renovate bot commented Nov 16, 2021 •

edited

Loading

`v8.4.0`: 8.4 “President Camio”

Migration from Jest to `uvu`

`v8.3.0`: 8.3 “Duke Murmur”

`Document` Nodes

`Node#assign()` Shortcut

`v8.2.0`: 8.2 “Prince Orobas”

`v8.1.0`: 8.1 “Duke Gemory”

`v8.0.0`: 8.0 “President Ose”