gpt4 book ai didi

css - CodeKit 2 - 用代码中的空行编译 less

转载 作者:行者123 更新时间:2023-11-28 17:29:10 26 4
gpt4 key购买 nike

我正在使用 Codekit 2.1.8 编译我的 LESS 文件。在我的 LESS 文件中,我有空行,我也想将它们放在已编译的 CSS 文件中,但 Codekit 似乎删除了它们。我在 Codekit 中找不到与此问题相关的任何选项。

示例:

更少的文件:

p {
font-size: 14px;
}



a {
color: red;
}

使用 Codekit 编译的 CSS 文件:

p {
font-size: 14px;
}
a {
color: red;
}

最佳答案

使用默认命令行或客户端时,您可以轻松添加自 v2.1 起的自己的插件。 Less 保留 /**/ 注释。

添加 LESS 代码,例如 /*3*/ 3 个换行符。

现在编写插件,调用这个文件less-plugin-add-newlines.js:

var getCommentsProcessor = require("./comments-processor");

module.exports = {
install: function(less, pluginManager) {
var CommentsProcessor = getCommentsProcessor(less);
pluginManager.addPostProcessor(new CommentsProcessor());
}
};

然后编写 comments-processor.js:

String.prototype.repeat = function( num )
{
return new Array( num + 1 ).join( this );
}


module.exports = function(less) {
function CommentProcessor(options) {
this.options = options || {};
};

CommentProcessor.prototype = {
process: function (css) {
var r = new RegExp("(\\/\\*)([0-9]+)(\\*\\/)","g");
return css.replace(r,function(m1,m2,m3){ return "\n".repeat(m3*1-1); });
}
};

return CommentProcessor;
};

较少

p1 {
p:3;
}
/*3*/
p2 {
p:3;
}
/*4*/
p2 {
p:3;
}

运行lessc --plugin=less-plugin-add-newlines.js index.less时会编译成:

p1 {
p: 3;
}



p2 {
p: 3;
}




p2 {
p: 3;
}

关于css - CodeKit 2 - 用代码中的空行编译 less,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26517186/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com