const regex = /(--[\w-]+:[\s]*[^;\n}]+)/gm;
// Alternative syntax using RegExp constructor
// const regex = new RegExp('(--[\\w-]+:[\\s]*[^;\\n}]+)', 'gm')
const str = `these should match
:root {
--externalcolor: red;
--samename: orange;
--samename: #0f0;
--foo: green;
--FOO: #0f0;
--halfsuccess: orange;
/* multiple on one line */
--success: green;--success2: #0f0;
/* forget the ; */
--success: green
--success2: #0f0
--fred: var(--foo);
--barney: var(--foo, test)
}
:root {
/* name options */
--4name: startsWithNumber;
--name: startsWithLetter;
/* value options */
--startWithLetter: red;
--startWithPound: #0f0;
--startWithNumber: 20px;
--startWithQuoteDouble: "test";
--startWithQuoteSingle: 'test';
--containsUrl: url("http://test.com/foo?a=b&c=d");
--containsPunctuation: -_,.;
--containsSpace: "test space";
/* misc conditions*/
--multipleOnOneLine1: green; --multipleOnOneLine2: #0f0;
--noSpaceAfterColon:test;
--multiSpaceAfterColon: test;
--dash-in-name: test;
--underscore_in_name: test;
}
/* minified css */
:root{--almost-black:#222;}html{color:var(--almost-black)}body{color:var(--almost-black);
don't match this (the double dash in the comments
/* ----------------------------------------------------- */
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap");
on one line
/* ----------------------------------------------------- */ @import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap");`;
// Reset `lastIndex` if this regex is defined globally
// regex.lastIndex = 0;
let m;
while ((m = regex.exec(str)) !== null) {
// This is necessary to avoid infinite loops with zero-width matches
if (m.index === regex.lastIndex) {
regex.lastIndex++;
}
// The result can be accessed through the `m`-variable.
m.forEach((match, groupIndex) => {
console.log(`Found match, group ${groupIndex}: ${match}`);
});
}
Please keep in mind that these code samples are automatically generated and are not guaranteed to work. If you find any syntax errors, feel free to submit a bug report. For a full regex reference for JavaScript, please visit: https://developer.mozilla.org/en/docs/Web/JavaScript/Guide/Regular_Expressions