coffeescript - ejemplos - graficos con d3 js

Visualizar gramática LALR

Question

Me gustaría visualizar un archivo de gramática (en realidad, la gramática de Jison para coffee-script). Entonces el archivo de entrada es un archivo de gramática de estilo Bison / Yacc. El resultado esperado podría ser un archivo de puntos Graphviz o algo similar.

No necesariamente estoy buscando un IDE completo, como GOLD . Pero es importante poder manejar una entrada LALR, por eso el excelente ANLTRWorks no se tiene en cuenta.

También verifiqué una comparación de analizadores sintácticos en Wikipedia , pero solo incluye soporte IDE, pero no visualización.

Este es el archivo de gramática de coffeescript que realmente quiero visualizar.

Answer 1

Aquí están las instrucciones para crear un diagrama de sintaxis.

El contenido de grammar.coffee es un código ejecutable, que se debe ejecutar para obtener la gramática de Jison real. Usé la página Try CoffeeScript para compilarla, después de haber reemplazado la llamada de Jison por una alerta de Javascript. Luego ejecuté el Javascript resultante para obtener la gramática, que se ve así:

{
  "tokens":" TERMINATOR TERMINATOR TERMINATOR STATEMENT INDENT OUTDENT INDENT OUTDENT IDENTIFIER NUMBER STRING JS REGEX BOOL = = INDENT OUTDENT : : INDENT OUTDENT RETURN RETURN HERECOMMENT PARAM_START PARAM_END -> =>  ,  , ... = ... . ?. :: :: INDEX_START INDEX_END INDEX_SOAK { }  , TERMINATOR INDENT OUTDENT CLASS CLASS CLASS EXTENDS CLASS EXTENDS CLASS CLASS CLASS EXTENDS CLASS EXTENDS SUPER SUPER  FUNC_EXIST CALL_START CALL_END CALL_START CALL_END THIS @ @ [ ] [ ] .. ... [ ] , TERMINATOR INDENT OUTDENT INDENT OUTDENT , TRY TRY TRY FINALLY TRY FINALLY CATCH THROW ( ) ( INDENT OUTDENT ) WHILE WHILE WHEN UNTIL UNTIL WHEN LOOP LOOP FOR FOR FOR OWN , FORIN FOROF FORIN WHEN FOROF WHEN FORIN BY FORIN WHEN BY FORIN BY WHEN SWITCH INDENT OUTDENT SWITCH INDENT ELSE OUTDENT SWITCH INDENT OUTDENT SWITCH INDENT ELSE OUTDENT LEADING_WHEN LEADING_WHEN TERMINATOR IF ELSE IF ELSE POST_IF POST_IF UNARY - + -- ++ -- ++ ? + - MATH SHIFT COMPARE LOGIC RELATION COMPOUND_ASSIGN COMPOUND_ASSIGN INDENT OUTDENT EXTENDS",
  "bnf":
  {
    "Root":
    [
      ["","return $$ = new yy.Block;",null],
      ["Body","return $$ = $1;",null],
      ["Block TERMINATOR","return $$ = $1;",null]
    ],
    "Body":
    [
      ["Line","$$ = yy.Block.wrap([$1]);",null],
      ["Body TERMINATOR Line","$$ = $1.push($3);",null],
      ["Body TERMINATOR","$$ = $1;",null]
    ],
    "Line":
    [
      ["Expression","$$ = $1;",null],
      ["Statement","$$ = $1;",null]
    ],
    ...

Lo anterior se puede alimentar al convertidor de gramática Jison-to-W3C , lo que da como resultado una gramática como esta:

Root     ::= ( Body | Block TERMINATOR )?
Body     ::= Line ( TERMINATOR Line | TERMINATOR )*
Line     ::= Expression
           | Statement
...

Desde aquí podemos hacer que Railroad Diagram Generator cree un diagrama de sintaxis:

. . .

Tenga en cuenta que el convertidor solo evalúa la parte "bnf" de la gramática, por lo que no tiene en cuenta las definiciones de token. Esto podría mejorarse haciendo un postprocesamiento manual de la gramática al estilo W3C.

Answer 2

así que lo intenté de nuevo y encontré mi error más flagrante de inmediato: la json que había publicado estaba usando incorrectamente las comillas simples en lugar de las dobles. déjame detallar el flujo de trabajo; es lo suficientemente simple, y si ya está utilizando CoffeeScript en NodeJS, está listo:

• localice el módulo node_modules/coffee-script/lib/coffee-script/grammar.js en su sistema de archivos;

• copie y pegue el código de ese archivo en el panel de origen del panel js-> coffee en el sitio js2coffee (podría omitirlo, pero me parece mucho más agradable editar CS que manipular JS).

• guarde el código traducido en node_modules/coffee-script/lib/coffee-script/grammar.coffee ;

• ve y encuentra

  exports.parser = new Parser(
    tokens: tokens.join(" ")
    bnf: grammar
    operators: operators.reverse()
    startSymbol: "Root"
  )

  en el código; reemplazarlo con

  console.log JSON.stringify
    tokens: tokens.join " "
    bnf: grammar
    operators: operators.reverse()
    startSymbol: "Root"

  teniendo cuidado de usar la misma sangría exacta (dos espacios para la primera línea, cuatro para el resto).

• desde la línea de comando, ejecute algo así como coffee node_modules/coffee-script/lib/coffee-script/grammar.coffee > /tmp/coffee.grammar ;

• copie y pegue el código del archivo resultante en el convertidor de gramática ;

• copie y pegue la gramática EBNF resultante del convertidor en el editor de gramática en el generador de diagramas ferroviarios ;

• ve a la pestaña del Diagrama de Vista y ¡regocíjate!

es una especie de tarea para hacer todo esto de copy''n''pastish, pero ciertamente lo suficientemente bueno para cualquier visualización única. He estado buscando mucho en la web para obtener un generador de diagramas de RR razonable, y este en particular está definitivamente entre los que tienen el mejor resultado. algo sorprendente cuando piensas en qué tan simples son realmente los diagramas de ferrocarril.