Skip to content
/ shortstack Public template

🥞 minimal Rollup + PostCSS modern syntax starter template

Notifications You must be signed in to change notification settings

argyleink/shortstack

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Netlify Status

CSS

PostCSS to bundle, import from NPM, local or remote URLs, plus postcss-preset-env for latest CSS features.

JS

Rollup to bundle, treeshake, import from NPM, local or remote URLs, import processed CSS, plus babel-preset-env for latest JS features.

Servers

Browsersync with all the goodies for local dev: live reload, hot swap CSS, scroll syncing, remote debugging, etc. Prod server is just a static server.


Watch me break it down on YouTube!



Getting Started

use this as a Github template

OR

Clone Shortstack into a new folder

  1. mkdir new-project-name && cd $_
  2. git clone --depth=1 https://github.com/argyleink/shortstack.git . && rm -rf ./.git

OR (essentially the same thing with npx+degit)

  1. npx degit argyleink/shortstack#main

Install tools and spin it up

  1. npm i
  2. npm start



Development

Running npm start runs Browsersync, Rollup and Postcss concurrently, watching changes to your files in ./app and refreshes connected browsers.

Production

Running npm run build compiles and minifies your code in app and outputs the optimised result to a folder called dist that's ready for static hosting.

Running npm run production will build your project and start a server at dist.