KC's Workspace
    Preparing search index...

    Class CssSyntaxError_

    The CSS parser throws this error for broken CSS.

    Custom parsers can throw this error for broken custom syntax using the Node#error method.

    PostCSS will use the input source map to detect the original error location. If you wrote a Sass file, compiled it to CSS and then parsed it with PostCSS, PostCSS will show the original position in the Sass file.

    If you need the position in the PostCSS input (e.g., to debug the previous compiler), use error.input.file.

    // Raising error from plugin
    throw node.error('Unknown variable', { plugin: 'postcss-vars' })

    // Catching and checking syntax error
    try {
      postcss.parse('a{')
    } catch (error) {
      if (error.name === 'CssSyntaxError') {
        error //=> CssSyntaxError
      }
    }

    Hierarchy

    Index

    Constructors

    constructor

    Properties

    cause? column? endColumn? endLine? file? input? line? message name plugin? reason source? stack stackTraceLimit

    Methods

    showSourceCode toString captureStackTrace isError prepareStackTrace

    Constructors

    • new CssSyntaxError_(
          message: string,
          lineOrStartPos?: number | RangePosition,
          columnOrEndPos?: number | RangePosition,
          source?: string,
          file?: string,
          plugin?: string,
      ): CssSyntaxError_

      Instantiates a CSS syntax error. Can be instantiated for a single position or for a range.

      Parameters

      • message: string

        Error message.

      • OptionallineOrStartPos: number | RangePosition

        If for a single position, the line number, or if for a range, the inclusive start position of the error.

      • OptionalcolumnOrEndPos: number | RangePosition

        If for a single position, the column number, or if for a range, the exclusive end position of the error.

      • Optionalsource: string

        Source code of the broken file.

      • Optionalfile: string

        Absolute path to the broken file.

      • Optionalplugin: string

        PostCSS plugin name, if error came from plugin.

      Returns CssSyntaxError_

    Properties

    cause?: unknown
    column?: number

    Source column of the error.

    error.column       //=> 1
    error.input.column //=> 4

    PostCSS will use the input source map to detect the original location. If you need the position in the PostCSS input, use error.input.column.

    endColumn?: number

    Source column of the error's end, exclusive. Provided if the error pertains to a range.

    error.endColumn       //=> 1
    error.input.endColumn //=> 4

    PostCSS will use the input source map to detect the original location. If you need the position in the PostCSS input, use error.input.endColumn.

    endLine?: number

    Source line of the error's end, exclusive. Provided if the error pertains to a range.

    error.endLine       //=> 3
    error.input.endLine //=> 4

    PostCSS will use the input source map to detect the original location. If you need the position in the PostCSS input, use error.input.endLine.

    file?: string

    Absolute path to the broken file.

    error.file       //=> 'a.sass'
    error.input.file //=> 'a.css'

    PostCSS will use the input source map to detect the original location. If you need the position in the PostCSS input, use error.input.file.

    input?: FilePosition

    Input object with PostCSS internal information about input file. If input has source map from previous tool, PostCSS will use origin (for example, Sass) source. You can use this object to get PostCSS input source.

    error.input.file //=> 'a.css'
    error.file       //=> 'a.sass'
    line?: number

    Source line of the error.

    error.line       //=> 2
    error.input.line //=> 4

    PostCSS will use the input source map to detect the original location. If you need the position in the PostCSS input, use error.input.line.

    message: string

    Full error text in the GNU error format with plugin, file, line and column.

    error.message //=> 'a.css:1:1: Unclosed block'
    name: "CssSyntaxError"

    Always equal to 'CssSyntaxError'. You should always check error type by error.name === 'CssSyntaxError' instead of error instanceof CssSyntaxError, because npm could have several PostCSS versions.

    if (error.name === 'CssSyntaxError') {
      error //=> CssSyntaxError
    }
    plugin?: string

    Plugin name, if error came from plugin.

    error.plugin //=> 'postcss-vars'
    reason: string

    Error message.

    error.message //=> 'Unclosed block'
    source?: string

    Source code of the broken file.

    error.source       //=> 'a { b {} }'
    error.input.source //=> 'a b { }'
    stack: string
    stackTraceLimit: number

    The Error.stackTraceLimit property specifies the number of stack frames collected by a stack trace (whether generated by new Error().stack or Error.captureStackTrace(obj)).

    The default value is 10 but may be set to any valid JavaScript number. Changes will affect any stack trace captured after the value has been changed.

    If set to a non-number value, or set to a negative number, stack traces will not capture any frames.

    Methods

    • Returns a few lines of CSS source that caused the error.

      If the CSS has an input source map without sourceContent, this method will return an empty string.

      error.showSourceCode() //=> "  4 | }
                             //      5 | a {
                             //    > 6 |   bad
                             //        |   ^
                             //      7 | }
                             //      8 | b {"

      Parameters

      • Optionalcolor: boolean

        Whether arrow will be colored red by terminal color codes. By default, PostCSS will detect color support by process.stdout.isTTY and process.env.NODE_DISABLE_COLORS.

      Returns string

      Few lines of CSS source that caused the error.

    • Returns error position, message and source code of the broken part.

      error.toString() //=> "CssSyntaxError: app.css:1:1: Unclosed block
                       //    > 1 | a {
                       //        | ^"

      Returns string

      Error position, message and source code.

    • Creates a .stack property on targetObject, which when accessed returns a string representing the location in the code at which Error.captureStackTrace() was called.

      const myObject = {};
      Error.captureStackTrace(myObject);
      myObject.stack;  // Similar to `new Error().stack`

      The first line of the trace will be prefixed with ${myObject.name}: ${myObject.message}.

      The optional constructorOpt argument accepts a function. If given, all frames above constructorOpt, including constructorOpt, will be omitted from the generated stack trace.

      The constructorOpt argument is useful for hiding implementation details of error generation from the user. For instance:

      function a() {
        b();
      }

      function b() {
        c();
      }

      function c() {
        // Create an error without stack trace to avoid calculating the stack trace twice.
        const { stackTraceLimit } = Error;
        Error.stackTraceLimit = 0;
        const error = new Error();
        Error.stackTraceLimit = stackTraceLimit;

        // Capture the stack trace above function b
        Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
        throw error;
      }

      a();

      Parameters

      • targetObject: object
      • OptionalconstructorOpt: Function

      Returns void

    • Indicates whether the argument provided is a built-in Error instance or not.

      Parameters

      • error: unknown

      Returns error is Error

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Methods