javascript - less 文件的语法验证器

Question

我需要一个 less 文件的验证器。我需要仅在语法级别验证单个 less 文件。

我无法让验证器遵循依赖关系或检测是否声明了 mixin。这才是我真正的问题。

我发现很多较少的处理器失败，因为该文件具有我在流程的这一点上无法提供的依赖项。

npm 包就完美了。

Answer 1

最后，我决定使用 antlr4

步骤:

• 在计算机中安装antlr或添加到部署过程
• 了解您的语言的语法(尚未完成的工作还较少)
• 获取npm包来处理语法
• 在您的应用中使用它

配置为:

$ cd /usr/local/lib
$ sudo curl -O http://www.antlr.org/download/antlr-4.5-complete.jar
$ export CLASSPATH=".:/usr/local/lib/antlr-4.5-complete.jar:$CLASSPATH"
$ alias antlr4='java -jar /usr/local/lib/antlr-4.5-complete.jar'
$ alias grun='java org.antlr.v4.runtime.misc.TestRig

此信息直接来自网页。

现在你可以从 https://github.com/antlr/grammars-v4 获取语法

此时您可以generate the javascript version of your grammar

就我而言，我创建了一个目录，下载了文件并在其中编写了所有测试:

antlr4 -Dlanguage=JavaScript LessParser.g4
antlr4 -Dlanguage=JavaScript LessLexer.g4

此过程会生成一个您将使用的 JavaScript 文件，但您需要 antlr 库才能在 Node 程序中使用此文件。

npm link antlr4

Ant 现在开始编码:

var antlr4 = require('antlr4/index');
var MyGrammarLexer = require('./LessLexer.js');
var MyGrammarParser = require('./LessParser.js');
var input = "html{ .hey(); color: @light-blue; background:#333}";
var chars = new antlr4.InputStream(input);
var lexer = new MyGrammarLexer.LessLexer(chars);
var tokens  = new antlr4.CommonTokenStream(lexer);
var parser = new MyGrammarParser.LessParser(tokens);
parser.buildParseTrees = true;


var ErrorListener = antlr4.error.ErrorListener;
function CustomErrorListener() {
   ErrorListener.call(this);
   return this;
}

CustomErrorListener.prototype = Object.create(ErrorListener.prototype);
CustomErrorListener.prototype.constructor = CustomErrorListener;
CustomErrorListener.prototype.syntaxError = function(recognizer, offendingSymbol, line, column, msg, e) {
    throw ('throw a simple exception');
};

parser.addErrorListener(new CustomErrorListener());

try{
  var tree = parser.stylesheet();
} catch (e){
  console.log('I catch you!!!')
}

此代码中的重要部分是函数 lessLexer、lessParser 和 parser.stylesheet()；这因语法而异。最后一项很难知道，但它是语法中您想要验证的一点。就我而言，我得到文件 LessParser.g4，并且定义中的语法中有不同的 Node :

parser grammar LessParser;

options { tokenVocab=LessLexer; }

stylesheet
  : statement*
  ;

statement
  : importDeclaration
  | ruleset
  | variableDeclaration ';'
  | mixinDefinition
  ;

variableName
  : AT variableName
  | AT Identifier
  ;

commandStatement
  : (expression+) mathStatement?
  ;

mathCharacter
  : TIMES | PLUS | DIV | MINUS | PERC
  ;

在这种情况下，您可以验证字符串，如样式表、语句、变量名...

最后一个有趣的点是错误验证，我用它来停止第一个错误中的验证，我的情况很简单，但是你可以改进这一点