Can not find variable when a variable be created in plugin.

To reproduce:

I want to define a variable in plugin. It will insert @x: 33px to current scope.

module.exports = class LessPluginBestMixin {
    install(less, pluginManager, functions) {
        functions.add("x", () => {
            return new less.tree.Declaration(
                "@x",
                new less.tree.Value(new less.tree.Keyword("33px"))
            );
        });
        functions.add("define_var", (key) => {});
    }
};

When I write the code to a less file:

@plugin "the-plugin-path";

div {
    x();
    width: @x;
}

It works and return the css code:

div {
    width: 33px;
}

But when I write the code to a less file:

@plugin "the-plugin-path";

@a: 1px;

div {
    height: @a;
    x();
    width: @x;
}

It not works and return a error cause can not find the variable of @x.

I had tried debug the source code of less and I found the code:

The height need read this variable and execute the function of variable and be cached.
It lead to the function of variable can not run again when the width read the @x.

I changed the code that will clear the cache when the function return a Declaration.

I tried to fix the code. URL

Current behavior:

Expected behavior:

Environment information:

• less version:
• nodejs version:
• operating system:

Start by reproducing the plugin example with the @a declaration before x() and compare it with the working example. Inspect the variable evaluation and caching logic shown in the issue, then review PR #4240; the issue is done when both @x and @a resolve correctly in the generated CSS.