Add function to get css variables declaration

Author: matz3

lib/index.js

@@ -306,6 +306,9 @@ Builder.prototype.build = function(options) {
 			}));
 			const varsOverride = oVariableCollector.getAllVariables();
 			const cssVariablesSource = oCSSVariablesCollector.toLessVariables(varsOverride);
+			// eslint-disable-next-line no-unused-vars
+			const cssVariablesOnly = oCSSVariablesCollector.getCssVariablesDeclaration();
+			// TODO: export cssVariablesOnly so that it can be written as css_variables_only.less
 
 			let cssSkeletonRtl;
 			if (oRTL) {

lib/plugin/css-variables-collector.js

@@ -87,19 +87,25 @@ CSSVariablesCollectorPlugin.prototype = {
 			const variableValue = this.calcVars[value].css;
 			lessVariables += `@${variableName}: ${variableValue};\n`;
 		});
-		lessVariables += "\n:root {\n";
-		Object.keys(vars).forEach((value, index) => {
-			if (vars[value].export) {
-				lessVariables += `--${value}: @${value};\n`;
-			}
-		});
-		Object.keys(this.calcVars).forEach((value, index) => {
-			if (this.calcVars[value].export) {
-				lessVariables += `--${value}: @${value};\n`;
+		lessVariables += "\n" + this.getCssVariablesDeclaration({includeCalcVars: true});
+		return lessVariables;
+	},
+	getCssVariablesDeclaration({includeCalcVars = false} = {}) {
+		let content = ":root {\n";
+		Object.keys(this.vars).forEach((value) => {
+			if (this.vars[value].export) {
+				content += `--${value}: @${value};\n`;
 			}
 		});
-		lessVariables += "}\n";
-		return lessVariables;
+		if (includeCalcVars) {
+			Object.keys(this.calcVars).forEach((value) => {
+				if (this.calcVars[value].export) {
+					content += `--${value}: @${value};\n`;
+				}
+			});
+		}
+		content += "}\n";
+		return content;
 	},
 
 	_getCSS(node) {