Pattern parser


81550.0.73 years ago4 years agoMinified + gzip package size for @bem/sdk.naming.cell.pattern-parser in KB



Parser for the path pattern from a preset with a naming convention.

This is an internal package that is used in the @bem/sdk.naming.cell.stringify and @bem/sdk.naming.cell.match packages.

NPM Status


The tool parses a pattern and creates an array with separate elements from the pattern.

The pattern describes the file structure organization of a BEM project. For example, the ${layer?${layer}.}blocks/${entity}.${tech} pattern matches the file path: my-layer.blocks/my-file.css.

Note. If you don't have any BEM projects available to try out the @bem/sdk.naming.cell.stringify package, the quickest way to create one is to use bem-express.

Try pattern-parser

An example is available in the RunKit editor.

Quick start

Attention. To use @bem/sdk.naming.cell.pattern-parser, you must install Node.js 8.0+.

In this quick start you will learn how to use this package to parse the path pattern from the origin preset.

To run the @bem/sdk.naming.cell.pattern-parser package:

  1. Install required packages.
  2. Create a parse() function.
  3. Parse the path pattern.

Installing required packages

Install the following packages:

To install the packages, run the following command:

$ npm install --save @bem/sdk.naming.cell.pattern-parser @bem/sdk.naming.presets

Creating a parse() function

Create a JavaScript file with any name (for example, app.js) and insert the following:

const parse = require('@bem/sdk.naming.cell.pattern-parser');

After that you can use the parse() function to parse a path pattern.

Parsing the path pattern from the origin preset

To parse a pattern, use the created function.

The pattern from the origin preset is equal to ${layer?${layer}.}blocks/${entity}.${tech}. Parse this pattern.

const originNaming = require('@bem/sdk.naming.presets/origin');

// => ['', ['layer', '', 'layer', '.'], 'blocks/', 'entity', '.', 'tech']

RunKit live example

API reference


Parses a path pattern into array representation.

 * @param {string} pattern — Template-string-like pattern that describes
 *                           the file structure organization of a BEM project.
 * @returns {Array} — Array with separated elements from the pattern.

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.