Security News
PyPI’s New Archival Feature Closes a Major Security Gap
PyPI now allows maintainers to archive projects, improving security and helping users make informed decisions about their dependencies.
By Sarah Gooding - Jan 30, 2025
New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
minifyfromhtml
Advanced tools
minifyfromhtml
This little helper minifies scripts and css starting from an html file.
What it is
I am making a js widget, like a map, or a calendar field or something. This is the index.html I use while developing the widget:
<!DOCTYPE html>
<html lang="en">
<head>
<title>example page</title>
<script src="somelib.js"></script>
<script src="someotherlib.js"></script>
<script src="awesomelib.js"></script>
<script src="spectacularlib.js"></script>
<script src="app.js"></script>
<link rel="stylesheet" type="text/css" href="some.css" />
<link rel="stylesheet" type="text/css" href="app.css" />
</head>
<body>
<div id="widget"></div>
<script>
myapp(document.getElementById('widget'));
</script>
</body>
</html>
I am not using a framework like angular or react. I am coding along in app.js, and add libraries as I need them to index.html.
Then comes a time I want to distribute my widget to the world. To do that, I would like to
- minify all referenced js files in index.html
- minify all css files
so that users of my widget can just include widget.js and widget.css and be good to go.
Is there something I can use that does that for me with minimal hassle? Something like
$ magictool index.html
- nice html you have. let me parse that and see what I need to do...
- oh, you have somelib.js. let me minify that for you and put it in dist.js
- oh, you have someotherlib.js. let me minify that for you and put it in dist.js
- oh, you have awesomelib.js. let me minify that for you and put it in dist.js
- oh, you have spectacularlib.js. let me minify that for you and put it in dist.js
- oh, you have app.js. let me minify that for you and put it in dist.js
- oh, you have some.css. let me minify that for you and put it in dist.css
- oh, you have app.css. let me minify that for you and put it in dist.css
! dist.js and dist.css created!
that reads index.html and creates a dist.js and dist.css.
the magictool is minifyfromhtml.
Quickstart
npm i -g minifyfromhtml
minifyfromhtml --js=dist.js --css=dist.css < index.html
=>
some.css -> dist.css
app.css -> dist.css
somelib.js -> dist.js
someotherlib.js -> dist.js
awesomelib.js -> dist.js
spectacularlib.js -> dist.js
app.js -> dist.js
Keywords
FAQs
minify scripts and css starting from an html file
We found that minifyfromhtml demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Package last updated on 20 Aug 2022
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Related posts
Research
Security News
North Korean APT Lazarus Targets Developers with Malicious npm Package
Malicious npm package postcss-optimizer delivers BeaverTail malware, targeting developer systems; similarities to past campaigns suggest a North Korean connection.
By Kirill Boychenko, Peter van der Zee - Jan 29, 2025
Security News
CISA Brings KEV Data to GitHub
CISA's KEV data is now on GitHub, offering easier access, API integration, commit history tracking, and automated updates for security teams and researchers.
By Sarah Gooding - Jan 29, 2025