Movatterモバイル変換


[0]ホーム

URL:


Skip to content
DEV Community
Log in Create account

DEV Community

itzsrikanth
itzsrikanth

Posted on

PostCSS: Processor and Plugin module

Table of contents

Processor

Creates aProcessor instance. This instance can be used on multiple Stylesheets.postcss default export function returns aProcessor instance. The main purpose of this module is to process the plugins, which is calledNormalization here, add to theplugins data member for storage and return aLazyResult promise.

Data members

plugins -Array<Plugin|Transformer|TransformCallback>

stores a list of plugins added to thisProcessor instance.

Methods

use

takes in a plugin to append to the list of plugins and returns instance ofProcessor.

process

Parses CSS (can be passed in as various types) to returnLazyResult promise.

normalize

Takes inArray< plugin > are argument. For each of the plugin, the following steps are done:

  • Normalization involves a preprocessing step where
    • ifpostcss === true, it is executed immediately as function without argument.
    • ifpostcss contains any other truthy value, then the object is destructured to setpostcss as top level value.
  • Next step involves added the plugins to normalized list.
    • ifplugin isobject
      • andplugin.plugins isArray, the plugins are merged to the normalized plugin list.
      • andplugin.postcssPlugin is truthy, it is appended to normalized plugin list.
    • type'function' directs becomes eligible to be added in normalized list.
  • Other types are naturally eligible to enter the error conditions.

LazyResult

constructor

Takes in CSS either asstring or already parsedNode|Root, to passRoot to new instance ofResult. Along withResult,helpers andplugins are also added as data members to this.

Result

This is a very simple data structure to store fields (like a POJO):

  • processor
  • Array<Warning> asmessages
  • root
  • css
  • map
  • optsMain processing logic is present in other modules. Here, bothcontent andtoString returns the sameResult.css.

Plugins

Extends fromProcessors. If they areasync, thenPromise must be returned.

prepare

takes inResult and returnsProcessors

Warning

A simple structure that is used to get debug info i.e. source and location of the error and the plugin that is causing this. It has got a self-explanatorytoString method.

Other Entities

AcceptedPlugin

Processor takes an Array ofAcceptedPlugin which can be of type:

  • Plugin
  • PluginCreator<any>
  • OldPlugin<any>
  • TransformCallback
  • {postcss: TransformCallback|Processor}
  • Processor - The currentProcessor instance will copy thisProcessor's plugins

Top comments(0)

Subscribe
pic
Create template

Templates let you quickly answer FAQs or store snippets for re-use.

Dismiss

Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment'spermalink.

For further actions, you may consider blocking this person and/orreporting abuse

Passionate DivOps engineer
  • Location
    Bangalore, India
  • Work
    Senior Frontend Engineer at Linkedin
  • Joined

More fromitzsrikanth

DEV Community

We're a place where coders share, stay up-to-date and grow their careers.

Log in Create account

[8]ページ先頭

©2009-2025 Movatter.jp