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

felis-stack-compiler

v1.3.2

Published

A stack compiler for front-end web development

Downloads

4

Readme

Felis Stack Compiler


The Felis Stack Compiler is a stack compiler for front web development. It's a simple and easy way to manage, compress, and compile Sass, Ec6, and Html.

  • Html code is compressed down to optimize load time
  • Scss is compiled to CSS, auto-prefixed, and then compressed
  • And thanks to Babel, Ec6 Js is compiled to cross-browser friendly Js

Ussage

npm install -g felis-stack-compiler
felis-stack w \

That's it!

The compiler will automatically watch for changes in the files and compile sources when they are changed.


Command syntax

Usage: felis-stack <verb> [<args>]

The verbs are:

	h, help       Dispalys help
	w, watch      Watches for changes and compiles. Arguments:
					   <Dir>
					   <SassDir> <BabelDir> <HtmlDir>
					   <SassDir> <CssOutDir> <BabelDir> <JsOutDir> <HtmlDir>
	c, compile    Compiles, doesn't listen.
					   <Dir>
					   <SassDir> <BabelDir> <HtmlDir>
					   <SassDir> <CssOutDir> <BabelDir> <JsOutDir> <HtmlDir>

The args are:

	--debug <level>
			Prints debug information while code is running. Level (0 - 2)
			indicates how much debug info to print. 0(default) is least, 2 is most
	--ignore [dir, dir, ...]
			Ignores certian dirs
	--check <n>
			Checks for new files every n seconds.
			0 = don't check
			Default = 0
	--compileOnRun
			Compile files initially when felis-stack is called

Extentions:
	".max.htm" and ".max.html" files are compressed
	".babl" files are compressed
	".scss" files are compressed

What's compiled

.scss files are compiled and compressed

.js and .ec6 files are compiled and compressed

.max.html and .max.htm files are compressed


Technical notes

walk is used to find files

chokidar is used to monitor files for changes

node-sass is used to compile the Scss.

postcss and autoprefixer are used to auto-prefix the CSS.

crass is used to minify the css.

babel-core is used to compile ec6 and the babili preset is used to minify.

html-minifier is used to minify the html.


License

... undecided