Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/382.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 从渲染较少的CSS中删除属性_Javascript_Css_Less_Less Plugins - Fatal编程技术网

Javascript 从渲染较少的CSS中删除属性

Javascript 从渲染较少的CSS中删除属性,javascript,css,less,less-plugins,Javascript,Css,Less,Less Plugins,LessCSS(1.7.x)中似乎有一些模式允许(预/后)处理CSS渲染树。我想知道在呈现时是否可以使用访问者(我尝试过,但无法使其工作——或其他任何东西)从CSS输出中删除属性。 例如,如果输出为 a { font-size: 12px; -some-aribitrary-property: value; } 调用.toCSS时,我想从CSS输出中删除-一些任意属性。 我似乎找不到任何关于这方面的文档,只参考了即将发布的2.0版-有人知道这是否可能,如果是,如何做到,或者给我举个例子吗?

LessCSS(1.7.x)中似乎有一些模式允许(预/后)处理CSS渲染树。我想知道在呈现时是否可以使用访问者(我尝试过,但无法使其工作——或其他任何东西)从CSS输出中删除属性。 例如,如果输出为

a {
 font-size: 12px;
 -some-aribitrary-property: value;
}
调用
.toCSS
时,我想从CSS输出中删除
-一些任意属性。

我似乎找不到任何关于这方面的文档,只参考了即将发布的2.0版-有人知道这是否可能,如果是,如何做到,或者给我举个例子吗?

由于版本较少,您可以使用。您还可以在插件中使用访问者。有关使用访问者的示例,请访问:

在访问者插件中,您可以使用如下内容:

   visitRule: function (ruleNode, visitArgs) {
        if(ruleNode.name[0].value != '-some-aribitrary-property')
        {        
            return ruleNode;
        }
        else
        {
            return [];
        }   
    }
请注意,上面的代码当前没有删除,而是生成
。稍后我将更新我的答案,另请参见:


在v1.7中,它似乎对访问者不起作用-你有这样的例子吗

对于小于v2的

更新

按照@Joscha本人的建议,使用:

var parser = new(less.Parser)();
parser.parse(yourLessData, function(err, tree) { 
    var css = tree.toCSS({
        plugins: [new RemoveProperty()]
    });
});
与:

结束更新

lib/less
中创建一个名为
custom visitor.js
的文件,该文件包含以下内容:

(function (tree) {

    tree.RemoveProperty = function() {
        this._visitor = new tree.visitor(this);
    };
    tree.RemoveProperty.prototype = {
        isReplacing: true,
        run: function (root) {
        return this._visitor.visit(root);
        },
        visitRule: function (ruleNode, visitArgs) {
            if(ruleNode.name != '-some-aribitrary-property')
            {        
                return ruleNode;
            }
            else {
                return [];
            }
        }
    };
})(require('./tree'));
在less/lib/index.js中添加
require('./custom visitor.js'),此文件的结尾将如下所示:

require('./env');
require('./functions');
require('./colors');
require('./visitor.js');
require('./import-visitor.js');
require('./extend-visitor.js');
require('./join-selector-visitor.js');
require('./custom-visitor.js');
require('./to-css-visitor.js');
require('./source-map-output.js');

for (var k in less) { if (less.hasOwnProperty(k)) { exports[k] = less[k]; }}
最后,
new(tree.RemoveProperty)(),
进入less/lib/parser.js,位于第554行附近,因此代码如下所示:

visitors = [
    new(tree.joinSelectorVisitor)(),
    new(tree.processExtendsVisitor)(),
    new(tree.RemoveProperty)(),
    new(tree.toCSSVisitor)({compress: Boolean(options.compress)})
    ],

由于v2较少,因此可以使用。您还可以在插件中使用访问者。有关使用访问者的示例,请访问:

在访问者插件中,您可以使用如下内容:

   visitRule: function (ruleNode, visitArgs) {
        if(ruleNode.name[0].value != '-some-aribitrary-property')
        {        
            return ruleNode;
        }
        else
        {
            return [];
        }   
    }
请注意,上面的代码当前没有删除,而是生成
。稍后我将更新我的答案,另请参见:


在v1.7中,它似乎对访问者不起作用-你有这样的例子吗

对于小于v2的

更新

按照@Joscha本人的建议,使用:

var parser = new(less.Parser)();
parser.parse(yourLessData, function(err, tree) { 
    var css = tree.toCSS({
        plugins: [new RemoveProperty()]
    });
});
与:

结束更新

lib/less
中创建一个名为
custom visitor.js
的文件,该文件包含以下内容:

(function (tree) {

    tree.RemoveProperty = function() {
        this._visitor = new tree.visitor(this);
    };
    tree.RemoveProperty.prototype = {
        isReplacing: true,
        run: function (root) {
        return this._visitor.visit(root);
        },
        visitRule: function (ruleNode, visitArgs) {
            if(ruleNode.name != '-some-aribitrary-property')
            {        
                return ruleNode;
            }
            else {
                return [];
            }
        }
    };
})(require('./tree'));
在less/lib/index.js中添加
require('./custom visitor.js'),此文件的结尾将如下所示:

require('./env');
require('./functions');
require('./colors');
require('./visitor.js');
require('./import-visitor.js');
require('./extend-visitor.js');
require('./join-selector-visitor.js');
require('./custom-visitor.js');
require('./to-css-visitor.js');
require('./source-map-output.js');

for (var k in less) { if (less.hasOwnProperty(k)) { exports[k] = less[k]; }}
最后,
new(tree.RemoveProperty)(),
进入less/lib/parser.js,位于第554行附近,因此代码如下所示:

visitors = [
    new(tree.joinSelectorVisitor)(),
    new(tree.processExtendsVisitor)(),
    new(tree.RemoveProperty)(),
    new(tree.toCSSVisitor)({compress: Boolean(options.compress)})
    ],

我试图编辑@bass jobsen的帖子,但被拒绝了,原因是它应该是一个答案。 因此,对于小于1.7.x的版本,您可以创建一个visitor类:

RemoveProperty = function() {
    this._visitor = new less.tree.visitor(this);
};
RemoveProperty.prototype = {
    isReplacing: true,
    run: function (root) {
        return this._visitor.visit(root);
    },
    visitRule: function (ruleNode, visitArgs) {
        if(ruleNode.name != '-some-aribitrary-property') {        
            return ruleNode;
        } else {
            return [];
        }
    }
};
然后在解析代码中,按如下方式使用:

var parser = new(less.Parser)();
parser.parse(yourLessData, function(err, tree) { 
    var css = tree.toCSS({
        plugins: [new RemoveProperty()]
    });
});

不需要对less本身进行修补(如@bass jobsen的答案)。

我试图将此作为对@bass jobsen的帖子的编辑,但遭到拒绝,原因是它应该是一个答案。 因此,对于小于1.7.x的版本,您可以创建一个visitor类:

RemoveProperty = function() {
    this._visitor = new less.tree.visitor(this);
};
RemoveProperty.prototype = {
    isReplacing: true,
    run: function (root) {
        return this._visitor.visit(root);
    },
    visitRule: function (ruleNode, visitArgs) {
        if(ruleNode.name != '-some-aribitrary-property') {        
            return ruleNode;
        } else {
            return [];
        }
    }
};
然后在解析代码中,按如下方式使用:

var parser = new(less.Parser)();
parser.parse(yourLessData, function(err, tree) { 
    var css = tree.toCSS({
        plugins: [new RemoveProperty()]
    });
});

不需要对less本身进行修补(如@bass jobsen的回答)。

嗨,bass,非常感谢,我知道2.0有很多改进,但是我需要对LESSCS 1.7.x进行修补-有没有类似的方法?好吧,对于旧版本,通过添加require('./custom visitor.js'),您可以添加自己的访问者添加
lib/less/index.js
的末尾;在v1.7中,它似乎对访问者不起作用-您有这样的例子吗?顺便说一句,因为规则也可以是变量,所以您可以只返回一些变量(例如
@删除了一些aribitrary属性
:)来抑制规则输出。空字符串也起作用,但返回任何内容都会在输出中生成空行。我认为可以在这里找到一个可能的解决方案:Hi Bass,非常感谢,我知道2.0有很多改进,但是我需要对Lesscs1.7.x进行改进-有没有类似的方法?对于旧版本,您可以通过添加require('./custom visitor.js'),添加自己的访问者添加
lib/less/index.js
的末尾;在v1.7中,它似乎对访问者不起作用-您有这样的例子吗?顺便说一句,因为规则也可以是变量,所以您可以只返回一些变量(例如
@删除了一些aribitrary属性
:)来抑制规则输出。空字符串也起作用,但返回任何内容都会在输出中生成空行。我认为可以在这里找到一个可能的解决方案: