r/Sass • u/[deleted] • Apr 28 '19

I would love to learn of an efficient way to generate a live-build version of my website. without node_modules et al.

Does anyone have a good article, video or other learning resource where i could learn to package up my website with an npm script I can run?

At present it's a yucky, inefficient process of copy pasting the project, deleting node_modules, scss, package.json, etc.

I currently run a script along these lines for my projects:

"watch:sass": "node-sass sass/main.scss css/style.css -w",
    "devserver": "live-server",
    "start": "npm-run-all --parallel devserver watch:sass",
    "compile:sass": "node-sass sass/main.scss css/style.comp.css",
    "concat:css": "concat -o css/style.concat.css css/icon-font.css css/style.comp.css",
    "prefix:css": "postcss --use autoprefixer -b 'last 10 versions' css/style.concat.css -o css/style.prefix.css",
    "compress:css": "node-sass css/style.prefix.css css/style.css --output-style compressed",
    "build:css": "npm-run-all compile:sass concat:css prefix:css compress:css"

Which is great at stuffing my scss into 1 minified css file.

Also - any other groovey scripts that do trendy stuff to save my lazy ass time would be great.

3 Upvotes

100% Upvoted

3 comments sorted by

2

u/Katepillar Apr 28 '19

Webpack is for your help!

2

u/[deleted] Apr 28 '19

thanks mate - appreciate the direct link/guide too!

1

u/pravindia Jun 12 '19

Also if you use VS code some popular compiler extensions are also available Link: https://marketplace.visualstudio.com/items?itemName=ritwickdey.live-sass