9

文法ファイル (実際には、 coffee-scriptのJison文法)を視覚化したいと思います。したがって、入力ファイルは Bison/Yacc スタイルの文法ファイルです。予想される出力は、Graphviz ドット ファイルまたは類似のものである可能性があります。

GOLDのような完全な IDE を必ずしも探しているわけではありません。しかし、LALR 入力を処理できることが重要です。そのため、優れたANLTRWorksは考慮されません。

ウィキペディアでパーサーの比較も確認しましたが、IDE のサポートのみが含まれており、視覚化は含まれていません。

これが実際に視覚化したいcoffeescript 文法ファイルです。

4

2 に答える 2

13

構文図を作成する手順は次のとおりです。

grammar.coffeeの内容は実行可能コードであり、実際の Jison 文法を取得するために実行する必要があります。Jison 呼び出しを Javascript アラートに置き換えた後、 Try CoffeeScriptページを使用してコンパイルしました。次に、生成された Javascript を実行して、次のような文法を取得します。

{
  "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]
    ],
    ...

上記をJison-to-W3C grammar converter に渡すと、次のような文法になります。

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

ここから、Railroad Diagram Generatorに構文図を作成させることができます。

CoffeeScript 構文図

. . .

コンバーターは文法の「bnf」部分のみを評価するため、トークン定義は考慮されないことに注意してください。これは、W3C スタイルの文法を手動で後処理することで改善される可能性があります。

于 2011-11-22T00:17:38.917 に答える
0

再試行したところ、最も露骨な間違いがすぐに見つかりました。投稿したjsonは、二重引用符ではなく単一引用符を誤って使用していました。ワークフローの詳細を説明しましょう。とても簡単です。すでに NodeJS で CoffeeScript を実行している場合は、すぐに使用できます。

  • node_modules/coffee-script/lib/coffee-script/grammar.jsファイルシステムでモジュールを見つけます。

  • そのファイルのコードをコピーして、 js2coffeeサイトの js->coffee ペインのソース ペインに貼り付けます (スキップすることもできますが、JS をいじるよりも CS を編集する方がはるかに快適だと思います)。

  • 翻訳されたコードを に保存しnode_modules/coffee-script/lib/coffee-script/grammar.coffeeます。

  • 行って見つける

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

    コードで; で置き換えます

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

    まったく同じインデントを使用するように注意します (最初の行に 2 つのスペース、残りの行に 4 つのスペース)。

  • コマンドラインから sth like coffee node_modules/coffee-script/lib/coffee-script/grammar.coffee > /tmp/coffee.grammar;を実行します。

  • 結果のファイルのコードをコピーして文法コンバーターに貼り付けます。

  • 結果の EBNF 文法をコンバーターから鉄道図ジェネレーターの文法エディターにコピー アンド ペーストします。

  • [ダイアグラムの表示] タブに移動して、喜んでください。

このようなコピペ的な作業をすべて行うのは、ちょっと面倒ですが、1 回限りの視覚化には十分です。私は合理的な RR ダイアグラム ジェネレーターを求めて Web をたくさん検索してきましたが、この特定の 1 つが間違いなく最も美しい出力を持つものの 1 つです。鉄道図が実際にいかに単純であるかを考えると、驚くべきことです。

于 2012-01-20T21:40:57.860 に答える