Files
awesome-awesomeness/html/npmscripts.html
2025-07-18 22:22:32 +02:00

222 lines
10 KiB
HTML
Raw Permalink Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!--lint ignore awesome-heading-->
<h1 id="awesome-npm-scripts-awesome">Awesome npm Scripts <a
href="https://awesome.re"><img src="https://awesome.re/badge.svg"
alt="Awesome" /></a></h1>
<p><a
href="https://www.npmjs.com"><img src="npm-logo.png" align="right" width="150"></a></p>
<blockquote>
<p>Everything awesome for using npm as a build tool.</p>
</blockquote>
<p>You might also like <a
href="https://github.com/sindresorhus/awesome-npm">awesome-npm</a>.</p>
<p><strong>Notice: Im currently too busy to actively expand this list;
therefore, Ive decided to make this an <a
href="http://openopensource.github.io/">OPEN Open Source Project</a>.
Individuals making significant and valuable contributions are given
commit-access to the project to contribute as they see fit.</strong></p>
<h2 id="contents">Contents</h2>
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
<ul>
<li><a href="#articles">Articles</a></li>
<li><a href="#videostalks">Videos/Talks</a></li>
<li><a href="#task-runners">Task Runners</a></li>
<li><a href="#file-watchers">File Watchers</a></li>
<li><a href="#dev-servers">Dev Servers</a></li>
<li><a href="#cross-platform-utilities">Cross-platform Utilities</a>
<ul>
<li><a href="#utility-packs">Utility Packs</a></li>
</ul></li>
<li><a href="#other-utilities">Other Utilities</a></li>
<li><a href="#miscellaneous">Miscellaneous</a></li>
<li><a href="#cross-platform-shell-reference">Cross-platform Shell
Reference</a></li>
<li><a href="#npm-run-reference"><code>npm run</code> Reference</a></li>
</ul>
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
<h2 id="articles">Articles</h2>
<ul>
<li><a
href="https://www.keithcirkel.co.uk/why-we-should-stop-using-grunt/">Why
we should stop using Grunt &amp; Gulp</a> - Blog post by Keith
Cirkel.</li>
<li><a
href="https://www.keithcirkel.co.uk/how-to-use-npm-as-a-build-tool/">How
to Use npm as a Build Tool</a> - Sequel to »Why we should stop using
Grunt &amp; Gulp«.</li>
<li><a
href="https://medium.freecodecamp.com/why-i-left-gulp-and-grunt-for-npm-scripts-3d6853dd22b8">Why
I Left Gulp and Grunt for npm Scripts</a> - Article by Cory House.</li>
<li><a
href="http://michael-kuehnel.de/tooling/2018/03/22/helpers-and-tips-for-npm-run-scripts.html">Helpers
and tips for npm run scripts</a> - Blog post by Michael Kühnel covering
advanced topics.</li>
<li><a
href="https://exploringjs.com/nodejs-shell-scripting/ch_package-scripts.html">Running
cross-platform tasks via npm package scripts</a> - The most
comprehensive guide to using npm Scripts by Dr. Axel Rauschmayer.</li>
</ul>
<h2 id="videostalks">Videos/Talks</h2>
<ul>
<li><a href="https://www.youtube.com/watch?v=0RYETb9YVrk">Advanced
front-end automation with npm scripts</a> - Talk at Nordic.js 2015 by
Kate Hudson.</li>
<li><a
href="http://www.penta-code.com/how-to-create-a-build-system-with-npm-scripts/">How
to create a build system with npm scripts</a> - Video tutorial series on
setting up a front-end build system.</li>
</ul>
<h2 id="task-runners">Task Runners</h2>
<p>Tools for running multiple commands or npm scripts in parallel or
sequentially.</p>
<ul>
<li><a
href="https://github.com/paulpflug/script-runner">script-runner</a> -
Simple task runner with a terse syntax.</li>
<li><a href="https://github.com/mysticatea/npm-run-all">npm-run-all</a>
- Fully featured task runner.</li>
<li><a href="https://github.com/coderaiser/redrun">redrun</a> - Expand
scripts from package.json to improve execution speed.</li>
</ul>
<h2 id="file-watchers">File Watchers</h2>
<p>Tools to watch your source files and run a build command whenever any
of the files change.</p>
<ul>
<li><a href="https://github.com/Qard/onchange">onchange</a> -
<code>onchange &lt;glob&gt; -- &lt;command&gt;</code>.</li>
<li><a href="https://github.com/mikeal/watch">watch</a> -
<code>watch &lt;command&gt; &lt;directory&gt;</code>.</li>
</ul>
<h2 id="dev-servers">Dev Servers</h2>
<ul>
<li><a href="https://github.com/indexzero/http-server">http-server</a> -
Simple zero-configuration command-line http server.</li>
<li><a href="https://github.com/tapio/live-server">live-server</a> -
Simple development http server with live reload capability.</li>
</ul>
<h2 id="cross-platform-utilities">Cross-platform Utilities</h2>
<p>Utilities to perform common command-line tasks without worrying about
cross-platform compatibility.</p>
<ul>
<li><a href="https://github.com/isaacs/rimraf">rimraf</a> - Delete files
or directories; like <code>rm -rf</code>.</li>
<li><a href="https://github.com/sindresorhus/del-cli">del-cli</a> -
Safer file and folder deletion.</li>
<li><a href="https://github.com/substack/node-mkdirp">mkdirp</a> -
Create a directory, creating parent directories if needed; like
<code>mkdir -p</code>.</li>
<li><a href="https://github.com/davglass/cpr">cpr</a> -
<code>cp -r</code> for Node.js.</li>
<li><a href="https://github.com/sindresorhus/cpy-cli">cpy-cli</a> -
File/directory copying/renaming.</li>
<li><a href="https://github.com/calvinmetcalf/copyfiles">copyfiles</a> -
Copy a list of files into a directory.</li>
<li><a
href="https://github.com/byteclubfr/node-sync-files">sync-files</a> -
<code>rsync</code>-like directory syncing with watch mode.</li>
<li><a href="https://github.com/iamakulov/echo-cli">echo-cli</a> -
Cross-platform <code>echo</code> with JS escape sequence support.</li>
<li><a href="https://github.com/sindresorhus/clear-cli">clear-cli</a> -
Clear the terminal.</li>
<li><a href="https://github.com/kentcdodds/cross-env">cross-env</a> -
Set environment variables for scripts, unix-style.</li>
<li><a href="https://github.com/milewski/cross-os">cross-os</a> - Run
platform-specific npm scripts.</li>
<li><a href="https://github.com/stefanmaric/ntee">ntee</a> - Utility
that reads from standard input and writes to standard output and files;
like Unix <code>tee</code>.</li>
<li><a href="https://github.com/substack/catw">catw</a> - Print a file
to stdout, with optional watch mode; sorta like Unix
<code>cat</code>.</li>
</ul>
<h3 id="utility-packs">Utility Packs</h3>
<ul>
<li><a href="https://github.com/shelljs/shx">shx</a> - Collection of
common Unix utilities implemented in Node.js; example usage:
<code>shx rm somefile</code>.</li>
</ul>
<h2 id="other-utilities">Other Utilities</h2>
<ul>
<li><a href="https://github.com/keithamus/hashmark">hashmark</a> - Take
contents of a file and output as new file with a hash in the name.</li>
<li><a
href="https://github.com/sindresorhus/gzip-size-cli">gzip-size-cli</a> -
Get the gzipped size of a file or stdin.</li>
<li><a href="https://github.com/sindresorhus/opn-cli">opn-cli</a> - Open
websites, files, executables, etc. with the users preferred
application.</li>
<li><a href="https://github.com/heldr/headr">headr</a> - Add header /
banner info to a file.</li>
<li><a href="https://github.com/thompsonemerson/bower-files-cli">Bower
files CLI</a> - Get main bower files on the command line.</li>
<li><a
href="https://github.com/micromata/cli-error-notifier">cli-error-notifier</a>
- Send native desktop notifications when npm scripts fail.</li>
</ul>
<h2 id="miscellaneous">Miscellaneous</h2>
<ul>
<li><a href="https://github.com/samueleaton/screwy">screwy</a> - The npm
scripts GUI.</li>
<li><a href="https://github.com/stefanjudis/forrest">Forrest</a> - npm
scripts desktop client.</li>
<li><a href="https://github.com/timoxley/npm-run">run-npm</a> - Run
locally-installed node module executables. Useful for debugging npm
scripts.</li>
<li><a
href="https://github.com/bahmutov/npm-quick-run">npm-quick-run</a> -
Quickly run npm scripts by prefix without typing the full name.</li>
<li><a href="https://github.com/RyanZim/edit-script">edit-script</a> -
Edit npm scripts from the command line without worrying about JSON
escaping.</li>
<li><a href="https://github.com/ruyadorno/ntl">ntl</a> - Interactive cli
menu to list and run npm scripts.</li>
</ul>
<h2 id="cross-platform-shell-reference">Cross-platform Shell
Reference</h2>
<p>A quick reference of the shell operators &amp; commands that work the
same on Unix and Windows.</p>
<ul>
<li>Use <code>&amp;&amp;</code> to run commands in sequence. If a
command fails, the script exits.</li>
<li>Use <code>|</code> to pipe the stdout of one command into the stdin
of the next. (<code>do-something | something else</code>)</li>
<li>Use <code>&gt;</code> to write the stdout of a command to a file.
(<code>do-something &gt; file</code>)</li>
<li>Use <code>&lt;</code> to send the contents of a file to a commands
stdin. (<code>command &lt; file</code>)</li>
<li>Use <code>cd &lt;dir&gt;</code> to change the current working
directory to <code>&lt;dir&gt;</code>. Note that <code>cd</code> alone
prints the current working directory on windows, but changes the working
directory to <code>~</code> on *nix.</li>
</ul>
<h2 id="npm-run-reference"><code>npm run</code> Reference</h2>
<p>You can use <code>npm run-script</code> or <code>npm run</code>; they
both do the same thing, but <code>npm run</code> is shorter.</p>
<ul>
<li>Run just <code>npm run</code> to print a list of scripts.</li>
<li>Running <code>npm run script</code> (where <code>script</code> is
the name of your script) will run <code>prescript</code>,
<code>script</code>, and <code>postscript</code>; in that order.
<ul>
<li>You cant nest <code>pre</code> and <code>post</code> hooks
(i.e. <code>preprescript</code> wont work).</li>
</ul></li>
<li>You can pass arguments to your scripts by passing <code>--</code> to
<code>npm run</code>, followed by the arguments. Example: Given the
script <code>"mocha": "mocha"</code>, you can run
<code>npm run mocha -- --reporter xunit</code>. This effectively runs
<code>mocha --reporter xunit</code>.</li>
<li>Running <code>npm test</code> is the same as running
<code>npm run test</code>. The same applies to <code>npm start</code>
and <code>npm stop</code>.</li>
<li>You can run <code>npm run &lt;script&gt; -s</code> to silence the
default npm output (useful for calling a script within another
script).</li>
</ul>
<h2 id="contributing">Contributing</h2>
<p>See <a
href="https://github.com/RyanZim/awesome-npm-scripts/blob/master/CONTRIBUTING.md">CONTRIBUTING.md</a>.</p>
<p><a
href="https://github.com/RyanZim/awesome-npm-scripts">npmscripts.md
Github</a></p>