const regex = /(?:(?<=@import\s*(['"]|url\()\s*)((?:\S|\\\1)+)\s*(?:\1|\))\s*\)?\s?(.*?);)/g;
// Alternative syntax using RegExp constructor
// const regex = new RegExp('(?:(?<=@import\\s*([\'"]|url\\()\\s*)((?:\\S|\\\\\\1)+)\\s*(?:\\1|\\))\\s*\\)?\\s?(.*?);)', 'g')
const str = `# Drupal core/tests/Drupal/Tests/Core/Asset/css_test_files/css_input_with_import.css
@import "import1.css";
@import "import2.css";
@import url("http://example.com/style.css");
@import url("//example.com/style.css");
# Examples from https://developer.mozilla.org/en-US/docs/Web/CSS/%40import
@import url("finep;rint.css") print;
@import url("bluish.;css") projection, tv;
@import 'cust;om.css';
@import url("chrome://communi;cator/skin/");
@import "common.css" screen, projection;
@import url('landscape.css') screen and (orientation:landscape);
# Examples using htmlentities
@import 'https://fonts.googleapis.com/css?family=Sedgwick+Ave+Display&subset=latin-ext';
@import "https://fonts.googleapis.com/css?family=Sedgwick+Ave+Display&subset=latin-ext" ;
@import url("https://fonts.googleapis.com/css?family=Sedgwick+Ave+Display&subset=latin-ext");
@import url("https://fonts.googleapis.com/css?family=Sedgwick+Ave+Display&subset=latin-ext") tv;
@import url("https://fonts.googleapis.com/css?family=Sedgwick+Ave+Display&subset=latin-ext") only screen and (max-width:639px) and (orientation: portrait);
# Additional
@import "cu'st;om.css";
@import "cu\\"st;om.css";
@import "cu\\22st;om.css";
@import 'cus\\'t;om.css';
@import 'cus\\27t;om.css' ;
@import 'cus(t;om.css' ;
@import 'cus)t;om.css';
@import 'cus(t);om.css';
@import url( " http://user:pass@example.com/c'u(s)t;o\\"m.css " ) ;
@import url( ' http://user:pass@example.com/c"u(s)t;o\\'m.css ' ) ;
@import url( http://user:pass@example.com/c\\'u\\(s\\)t;om.css ) ;
# Inline
@import "cu'st;om.css"; @import "cu\\"st;om.css"; .my-class { display: block; }
@import "cu'st;om.css";@import url( " http://user:pass@example.com/c'u(s)t;o\\"m.css " ) ;.some-class { color: rgba(0, 0, 0); }@import url( http://user:pass@example.com/c\\'u\\(s\\)t;om.css ) ;.some-class { color: rgba(0, 0, 0); }
`;
// 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