MediaWiki  master
VueComponentParser Class Reference

Parser for Vue single file components (.vue files). More...

Public Member Functions

 parse (string $html, array $options=[])
 Parse a Vue single file component, and extract the script, template and style parts. More...
 

Private Member Functions

 findUniqueTags (DOMNode $rootNode, array $tagNames)
 Find occurrences of specified tags in a DOM node, expecting at most one occurrence of each. More...
 
 getStyleAndLang (DOMElement $styleNode)
 Get the contents and language of the <style> tag. More...
 
 getTemplateHtml ( $html, $minify)
 Get the HTML contents of the <template> tag, optionally minifed. More...
 
 newFilteringDispatcher (TreeBuilder $treeBuilder, $nodeName)
 Custom Dispatcher subclass that only dispatches tree events inside a tag with a certain name. More...
 
 newTemplateFormatter ( $minify)
 Custom HtmlFormatter subclass that optionally removes comments and strips whitespace. More...
 
 parseHTML ( $html)
 Parse HTML to DOM using RemexHtml. More...
 
 validateAttributes (DOMNode $node, array $allowedAttributes)
 Verify that a given node only has a given set of attributes, and no others. More...
 
 validateTemplateTag (DOMNode $templateNode)
 Check that the <template> tag has exactly one element child. More...
 

Detailed Description

Parser for Vue single file components (.vue files).

See parse() for usage.

Definition at line 39 of file VueComponentParser.php.

Member Function Documentation

◆ findUniqueTags()

VueComponentParser::findUniqueTags ( DOMNode  $rootNode,
array  $tagNames 
)
private

Find occurrences of specified tags in a DOM node, expecting at most one occurrence of each.

This method only looks at the top-level children of $rootNode, it doesn't descend into them.

Parameters
DOMNode$rootNodeNode whose children to look at
string[]$tagNamesTag names to look for (must be all lowercase)
Returns
DOMElement[] Associative arrays whose keys are tag names and values are DOM nodes

Definition at line 113 of file VueComponentParser.php.

Referenced by parse().

◆ getStyleAndLang()

VueComponentParser::getStyleAndLang ( DOMElement  $styleNode)
private

Get the contents and language of the <style> tag.

The language can be 'css' or 'less'.

Parameters
DOMElement$styleNodeThe <style> tag.
Returns
array [ 'style' => string, 'lang' => string ]
Exceptions
ExceptionIf an invalid language is used, or if the 'scoped' attribute is set.

Definition at line 188 of file VueComponentParser.php.

Referenced by parse().

◆ getTemplateHtml()

VueComponentParser::getTemplateHtml (   $html,
  $minify 
)
private

Get the HTML contents of the <template> tag, optionally minifed.

To work around a bug in PHP's DOMDocument where attributes like @click get mangled, we re-parse the entire file using a Remex parse+serialize pipeline, with a custom dispatcher to zoom in on just the contents of the <template> tag, and a custom formatter for minification. Keeping everything in Remex and never converting it to DOM avoids the attribute mangling issue.

Parameters
string$htmlHTML that contains a <template> tag somewhere
bool$minifyWhether to minify the output (remove comments, strip whitespace)
Returns
string HTML contents of the template tag

Definition at line 214 of file VueComponentParser.php.

References newFilteringDispatcher(), and newTemplateFormatter().

Referenced by parse().

◆ newFilteringDispatcher()

VueComponentParser::newFilteringDispatcher ( TreeBuilder  $treeBuilder,
  $nodeName 
)
private

Custom Dispatcher subclass that only dispatches tree events inside a tag with a certain name.

This effectively filters the tree to only the contents of that tag.

Parameters
TreeBuilder$treeBuilder
string$nodeNameTag name to filter for
Returns
Dispatcher

Definition at line 297 of file VueComponentParser.php.

Referenced by getTemplateHtml().

◆ newTemplateFormatter()

VueComponentParser::newTemplateFormatter (   $minify)
private

Custom HtmlFormatter subclass that optionally removes comments and strips whitespace.

If $minify=false, this formatter falls through to HtmlFormatter for everything (except that it strips the <!doctype html> tag).

Parameters
bool$minifyIf true, remove comments and strip whitespace
Returns
HtmlFormatter

Definition at line 235 of file VueComponentParser.php.

Referenced by getTemplateHtml().

◆ parse()

VueComponentParser::parse ( string  $html,
array  $options = [] 
)

Parse a Vue single file component, and extract the script, template and style parts.

Returns an associative array with the following keys:

  • 'script': The JS code in the <script> tag
  • 'template': The HTML in the <template> tag
  • 'style': The CSS/LESS styles in the <style> tag, or null if the <style> tag was missing
  • 'styleLang': The language used for 'style'; either 'css' or 'less', or null if no <style> tag

The following options can be passed in the $options parameter:

  • 'minifyTemplate': Whether to minify the HTML in the template tag. This removes HTML comments and strips whitespace. Default: false
Parameters
string$htmlHTML with <script>, <template> and <style> tags at the top level
array$optionsAssociative array of options
Returns
array
Exceptions
ExceptionIf the input is invalid

Definition at line 58 of file VueComponentParser.php.

References findUniqueTags(), getStyleAndLang(), getTemplateHtml(), parseHTML(), validateAttributes(), and validateTemplateTag().

◆ parseHTML()

VueComponentParser::parseHTML (   $html)
private

Parse HTML to DOM using RemexHtml.

Parameters
string$html
Returns
DOMDocument

Definition at line 97 of file VueComponentParser.php.

Referenced by parse().

◆ validateAttributes()

VueComponentParser::validateAttributes ( DOMNode  $node,
array  $allowedAttributes 
)
private

Verify that a given node only has a given set of attributes, and no others.

Parameters
DOMNode$nodeNode to check
array$allowedAttributesAttributes the node is allowed to have
Exceptions
ExceptionIf the node has an attribute it's not allowed to have

Definition at line 133 of file VueComponentParser.php.

Referenced by parse().

◆ validateTemplateTag()

VueComponentParser::validateTemplateTag ( DOMNode  $templateNode)
private

Check that the <template> tag has exactly one element child.

If the <template> tag has multiple children, or is empty, or contains (non-whitespace) text, an exception is thrown.

Parameters
DOMNode$templateNodeThe <template> node
Exceptions
ExceptionIf the contents of the <template> node are invalid

Definition at line 155 of file VueComponentParser.php.

Referenced by parse().


The documentation for this class was generated from the following file: