Определение грамматики для операторов импорта для сгенерированных jison языков CSS. - PullRequest
Новая
       22

Определение грамматики для операторов импорта для сгенерированных jison языков CSS.

0 голосов
/ 10 сентября 2018

Я пытаюсь создать парсер таблицы стилей с некоторыми дополнениями, чтобы поэкспериментировать с jison.Как я могу реализовать директиву импорта для загрузки других файлов в основной файл?Я немного смущен.Есть ли способ использовать лексер в файле грамматики?Могу ли я прочитать файл и затем токенизировать его?

grammar.jison 

%{
  var nodes = require('./nodes')
%}

%%

// Parsing starts here.
stylesheet:
  statements EOF                   { return new nodes.StyleSheet($1) }          
;

statements:
  /* empty */                      { $$ = [] }
| statementGroup                   { $$ = $1 }
| statements ';' statementGroup    { $$ = $1.concat($3) }
| statements ';'                   { $$ = $1 }
;

statementGroup:
  statement                        { $$ = [ $1 ] }
| rules
| rules statement                  { $$ = $1.concat($2) }
;

statement:
  variableDeclaration
;


rules:
  rule                             { $$ = [ $1 ] }
| rules rule                       { $$ = $1.concat($2) }
;

rule:
  selector '{' declarations '}'    { $$ = new nodes.Rule($1, $3) }
;

selector:
  IDENTIFIER
| SELECTOR
;

declarations:
  /* empty */                       { $$ = [] }
| declarationGroup                  { $$ = $1 }
| declarations ';' declarationGroup { $$ = $1.concat($3) }
| declarations ';'                  { $$ = $1 }
;

declarationGroup:
  declaration                       { $$ = [ $1 ] }
| rules
| rules declaration                 { $$ = $1.concat($2) }
;

declaration:
  property
| variableDeclaration
;

property:
  IDENTIFIER ':' values            { $$ = new nodes.Property($1, $3) }
;

variableDeclaration:
  VARIABLE ':' values              { $$ = new nodes.Assign($1, $3) }
;

values:
  value                            { $$ = [ $1 ] }
| values value                     { $$ = $1.concat($2) }
;

value:
  IDENTIFIER                       { $$ = new nodes.Literal($1) }
| COLOR                            { $$ = new nodes.Literal($1) }
| NUMBER                           { $$ = new nodes.Literal($1) }
| DIMENSION                        { $$ = new nodes.Literal($1) }
| VARIABLE                         { $$ = new nodes.Variable($1) }
;

tokens.jisonlex 

// Order is important. Rules are matches from top to bottom.

//// Macros
DIGIT                 [0-9]
NUMBER                {DIGIT}+(\.{DIGIT}+)? // matches: 10 and 3.14
NAME                  [a-zA-Z][\w\-]*       // matches: body, background-color and myClassName
SELECTOR              (\.|\#|\:\:|\:){NAME} // matches: #id, .class, :hover and ::before
PATH                  (.+)/([^/]+)          // matches ./bla/bla/nested.sss

%%

//// Rules
\s+                   // ignore spaces, line breaks

// Numbers
{NUMBER}(px|em|\%)    return 'DIMENSION' // 10px, 1em, 50%
{NUMBER}              return 'NUMBER' // 0
\#[0-9A-Fa-f]{3,6}    return 'COLOR' // #fff, #f0f0f0

// Selectors
{SELECTOR}            return 'SELECTOR' // .class, #id
{NAME}{SELECTOR}      return 'SELECTOR' // div.class, body#id

\@{NAME}              return 'VARIABLE' // @variable


{NAME}                return 'IDENTIFIER' // body, font-size

.                     return yytext // {, }, +, :, ;

<<EOF>>               return 'EOF'

node.js 

var Context = require('./context').Context

var compressed

function StyleSheet(rules, ss) {
  this.rules = rules
  this.ss = ss ? ss : []
}
exports.StyleSheet = StyleSheet

StyleSheet.prototype.toCSS = function(output) {
  compressed = output || false

  var context = new Context()

  var ret = this.rules.map(function (rule) { 
return rule.toCSS(context) }).filter(function (value) { return typeof value !== 'undefined' }).join('\n')

  return compressed ? ret.replace(/\s+/g, '') : ret
}

function Rule(selector, declarations) {
  this.selector = selector
  this.declarations = declarations
}
exports.Rule = Rule

Rule.prototype.toCSS = function(parentContext) {
  var propertiesCSS = [],
      nestedRulesCSS = [],
      context = new Context(this, parentContext)

  this.declarations.forEach(function(declaration) {
    var css = declaration.toCSS(context)

    if (declaration instanceof Property) {
      propertiesCSS.push(css)
    } else if (declaration instanceof Rule) {
      nestedRulesCSS.push(css)
    }
  })

  return [ context.selector() + ' { ' + propertiesCSS.join(' ') +  ' }' ].
         concat(nestedRulesCSS).
         join('\n')
}


function Property(name, values) {
  this.name = name
  this.values = values
}
exports.Property = Property

Property.prototype.toCSS = function(context) {
  var valuesCSS = this.values.map(function(value) { return value.toCSS(context) })
  return this.name + ': ' + valuesCSS.join(' ') + ';'
}


function Literal(value) {
  this.value = value
}
exports.Literal = Literal


Literal.prototype.toCSS = function() {
  return this.value
}


function Variable(name) {
  this.name = name
}
exports.Variable = Variable

Variable.prototype.toCSS = function(context) {
  return context.get(this.name)
}


function Assign(name, values) {
  this.name = name
  this.values = values
}
exports.Assign = Assign

Assign.prototype.toCSS = function(context) {
  var valuesCSS = this.values.map(function(value) { return value.toCSS(context) })
  context.set(this.name, valuesCSS.join(' '))
}

1 Ответ

0 голосов
/ 10 сентября 2018

Насколько я знаю, базовый лексер jison не допускает добавочный ввод; вам нужно дать ему одну строку, которую он маркирует.

Вы можете, однако, использовать свой собственный лексер (включая вызов в лексер jison), чтобы выполнять пошаговый лексинг. Таким образом, ваш пользовательский лексер должен реализовать входной стек, чтобы реализовать команду включения. Это не должно быть особенно сложно, хотя у меня нет примера под рукой.

...