RegEx匹配CSS文件中的特定javaDoc属性，并提取有关css定义的数据

I'm trying to store some meta data about CSS styles, which our app can use to build menus that allow the user to select those styles (amongst other things).

I thought the JavaDoc style comment was the best approach, and use an attribute like config or similar. Then store a JSON style definition as the value of that property.

I've been trying to write some RegEx (PHP) to do the following:

  1. Find all JavaDoc comments with @config attribute.
  2. Extract the value of @config as the JSON object
  3. Then match the following css TAG and CLASS names if they are defined under it.

So this comment and class definition could be extracted into 3 matches.

/**
 * @config {name:'Orange Title', order:1}
 */
h1.title_orange {

}
  • Match 1 : {name:'Orange Title', order:1}
  • Match 2 : h1
  • Match 3 : title_orange

What makes it more complex is the JSON part could be multiline, and the multilines may or may not contain the *.

The biggest task is on the assumptions you make (which things to test):

 (?:^\/\*\*[\s
]+\*\s@config\s(.*)$|^\s+\*\/[\s
]+[\#\.]?([\w-]+)\s*(?:[\#\.]*([\w-]+)\s*)*{$)

You can test it in this Rubular.

I assumed that you have config in the first comment line of the javaDoc, I also assumed that you may have multiple spaces randomly between these, that your words/classes/ids may have -.

What more do you need?

EDIT

This works great in Rubular. Although regex should be the same across languages, this doesn't seem to work in PHP Live Regex – Alexander 4 mins ago

You're right, so I compacted it into one match group and this one seems to be working (you have to click preg_match_all tab):

\/[*]{2}[\s
]+\*\s@config\s(.*)[\s
]+.*[\s
]+\*\/[\s
]+[\#\.]?([\w-]+)\s*(?:[\#\.]*([\w-]+)\s*)*{

Which means, I am considering the javaDoc and the CSS together (javaDoc with several lines). Still, there may be adjustments that need to be made.

EDIT2

Thats amazing, thanks so much! What if the @config wasn't always the first entry in the comment? Is that still possible ? – Matt Bryson 7 mins ago

It is:

\/[*]{2}(?:[\s
]+.*)*[\s
]+\*\s@config\s(.*)[\s
]+.*[\s
]+\*\/[\s
]+[\#\.]?([\w-]+)\s*(?:[\#\.]*([\w-]+)\s*)*{

You can try this one PHP Live Regex in preg_match_all tab.

EDIT3

Matt evolved his own regex to something simpler. The problem seems that the capture groups cannot be repeated indefinitely with this (to get all CSS classes/ids):

(?:[\#\.\,]([\w-]+)\s*)*

https://regex101.com/r/jM0yH0/6

Therefore, this still needs to be solved...