javascript regex single-line

Question

I'm trying to replace all @import strings in one single-string, e.g.

var str = 'buttons .reprint{height:56px;background-position:-47px -1496px;}@import "../common/buttons.css";@import "../screen/screen-1.css";@import "../screen/screen-2.css";@import "../screen/screen-3.css";@import "../screen/screen-5.css";@import "../screen/screen-6.css";@import "../screen/screen-7.css";@import "../screen/screen-quick-messages.css";@import "../screen/reset-password.css";#xml-data{display:none;}body{font-family:"Helvetica Neue",HelveticaNeue,Helvetica-Neue,Helvetica,sans-serif;}ul{padding:0;}body,section{width:768px;}';

It works if I write:

console.log(str.match(/@import\ /g));

But how to specify, all @import declaration at all in single line, e.g. @import "../screen/screen-1.css";

console.log(str.match(/@import\ .+;/g));

doesn't work.

As for the reason why your .+ "didn't work", the type of "didn't work" I can think of is that it matched too much, because + is greedy, meaning it would go to the last semicolon it found. Adding ? to a quantifier makes it becomes non-greedy - so /@import\ .+?;/g would work. But you could potentially have semicolons in the URL, so Tim's answer is obviously much better. Just wanted to explain what was wrong in case it helps another time. But do be as specific as you can always, it avoids errors. — Chris Morgan
– Chris Morgan, Commented Nov 13, 2010 at 12:43

Tim Pietzcker · Accepted Answer · 2010-11-13 12:02:46Z

3

Correct me if I'm wrong, but it seems like an @import always has this format:

@import (whitespace) (quote) (one or more non-quote characters) (quote) (semicolon)

If that's true, then let's build the regex accordingly:

 /@import\s*"[^"]+";/

This should match each @import statement separately.

answered Nov 13, 2010 at 12:02

Tim Pietzcker

337k59 gold badges520 silver badges572 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Roboblob Over a year ago

I think that solution given by somethingkindawierd is more general and deserves to be marked as answer.

Tim Pietzcker Over a year ago

@Roboblob: That may be (although Alex appears to disagree), but why is that a reason to downvote my answer?

Jonathan Beebe · Accepted Answer · 2010-12-22 17:10:41Z

1

I know it's already answered, but I just want to offer a simpler version of the pattern above.

I needed this regex for removing @import statements from css files I merged together.

It matches the pattern:

@import (anything NOT a semicolon) (semicolon)

Works great. Here's an example of how I use it:

// $mergedStyles set earlier in script...

// matches the pattern 
// ["@import"]+[anything NOT a semicolon]+semicolon
// e.g.: "@import url("stuff");
$pattern = '/@import[^;]*;/';
$mergedStyles = preg_replace($pattern, '', $mergedStyles);

answered Dec 22, 2010 at 17:10

Jonathan Beebe

5,2263 gold badges38 silver badges42 bronze badges

1 Comment

Roboblob Over a year ago

Thanks for sharing, i like this solution better since its more general and catches more variations of @import.

Collectives™ on Stack Overflow

javascript regex single-line

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related