npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

multiline-supplant

v0.1.0

Published

Multiline strings in JavaScript (with Doug Crockford's String supplant)

Downloads

10

Readme

multiline Build Status

Multiline strings in JavaScript

No more string concatenation or array join!

Note that ES6 will have template string which can be multiline, but time...

Before

var str = '' +
'<!doctype html>' +
'<html>' +
'	<body>' +
'		<h1>❤ unicorns</h1>' +
'	</body>' +
'</html>' +
'';

After

var str = multiline(function(){/*
<!doctype html>
<html>
	<body>
		<h1>❤ unicorns</h1>
	</body>
</html>
*/});

How

It works by wrapping the text in a block comment, anonymous function, and a function call. The anonymous function is passed into the function call and the contents of the comment extracted.

Even though it's slower than string concat, that shouldn't realistically matter as you can still do 2 million of those a second. Convenience over micro performance always.

Install

$ npm install --save multiline

Usage

Everything after the first newline and before the last will be returned as seen below:

var str = multiline(function(){/*
<!doctype html>
<html>
	<body>
		<h1>❤ unicorns</h1>
	</body>
</html>
*/});

Which outputs:

<!doctype html>
<html>
	<body>
		<h1>❤ unicorns</h1>
	</body>
</html>

Strip indent

You can use multiline.stripIndent() to be able to indent your multiline string without preserving the redundant leading whitespace.

	var str = multiline.stripIndent(function(){/*
			<!doctype html>
			<html>
				<body>
					<h1>❤ unicorns</h1>
				</body>
			</html>
	*/});

Which outputs:

<!doctype html>
<html>
	<body>
		<h1>❤ unicorns</h1>
	</body>
</html>

String substitution

console.log() supports string substitution:

var str = 'unicorns';

console.log(multiline(function(){/*
  I love %s
*/}), str);

//=> I love unicorns

Use cases

Have one? Let me know.

Experiment

I've also done an experiment where you don't need the anonymous function. It's too fragile and slow to be practical though.

It generates a callstack and extracts the contents of the comment in the function call.

var str = multiline(/*
<!doctype html>
<html>
	<body>
		<h1>❤ unicorns</h1>
	</body>
</html>
*/);

FAQ

But JS already has multiline strings with \?

var str = 'foo\
bar';

This is not a multiline string. It's line-continuation. It doesn't preserve newlines, which is the main reason for wanting multiline strings.

You would need to do the following:

var str = 'foo\n\
bar';

But then you could just as well concatenate:

var str = 'foo\n' +
'bar';

Note that ES6 will have real multiline strings.

Browser

While it does work fine in the browser, it's mainly intended for use in Node.js. Use at your own risk.

Install

$ bower install --save multiline
$ component install sindresorhus/multiline

Compatibility

  • Latest Chrome
  • Firefox >=17
  • Safari >=4
  • Opera >=9
  • Internet Explorer >=6

Minification

Even though minifiers strip comments by default there are ways to preserve them:

  • Uglify: Use /*@preserve instead of /* and enable the comments option
  • Closure Compiler: Use /*@preserve instead of /*
  • YUI Compressor: Use /*! instead of /*

You also need to add console.log after the comment so it's not removed as dead-code.

The final result would be:

var str = multiline(function(){/*!@preserve
<!doctype html>
<html>
	<body>
		<h1>❤ unicorns</h1>
	</body>
</html>
*/console.log});

License

MIT © Sindre Sorhus