Lightweight and Flexible Minifier (JS, CSS, HTML)

What is minifix?

minifix is a universal minifier that supports minification for JavaScript, CSS, and HTML files. It’s designed to be lightweight, easy to use, and highly configurable, making it a great tool for developers who want to optimize their code with minimal effort.

Features

• Efficient Minification: minifix uses powerful libraries like Terser for JavaScript, clean-css for CSS, and html-minifier-terser for HTML to ensure that your code is minified efficiently.

• Live File Watching: With live file-watching support, minifix automatically detects changes in your files and minifies them instantly, eliminating the need for manual execution.

• Configurable Options: You can customize the minification process for each file type using a simple configuration file. minifix leverages the power of three popular libraries, and you can fine-tune their behavior through the minifyOptions configuration:

  • CSS: Configure options using clean-css constructor options.
  • JavaScript: Customize minification with Terser options.
  • HTML: Adjust settings via html-minifier-terser options.

• Lightweight and Easy to Use: minifix is designed to be simple and straightforward, making it accessible for developers of all skill levels.

---

You can install it locally or globally using npm.

Installation

Before installing minifix, consider whether you need a local or global installation:

• A local installation is recommended for project-specific usage, ensuring that each project uses the correct version of minifix.
• A global installation allows you to use minifix across multiple projects system-wide without reinstalling it.

Local Installation

npm install --save-dev minifix

Global Installation

npm install --global minifix

Usage

Running Locally

npx minifix

Running Globally

minifix

📌 If minifix.config.mjs does not exist, it will be created automatically.

Configuration

minifix is highly configurable. You can define your input files, output files, and minification options in a minifix.config.mjs file. Here’s an example configuration:

/* minifix.config.mjs */
export default {
    inputs: ["views/input.html", "assets/css/input.css", "assets/js/input.js"],
    outputs: ["views/index.html", "assets/css/style.css", "assets/js/default.js"],
    minifyOptions: {
        css: {
            format: false
        },
        js: {
            format: {
                preamble: "/** Comment */"
            }
        },
        html: {
            collapseWhitespace: true,
            removeComments: true,
            removeRedundantAttributes: true
        }
    }
};

In this example, minifix will minify the specified input files and output the minified versions to the specified locations. You can also customize the minification options for each file type, such as preserving comments in JavaScript or removing redundant attributes in HTML.

Advanced Configuration

Here’s how you can customize each type of file:

• CSS: Use the clean-css constructor options to control how your CSS is minified. For example, you can disable formatting or enable advanced optimizations.

• JavaScript: Customize JavaScript minification with Terser options. You can add custom comments, control code formatting, and more.

• HTML: Adjust HTML minification settings using html-minifier-terser options. Options like collapseWhitespace and removeComments allow you to control how your HTML is processed.

Supported File Types

minifix supports minification for:

• JavaScript (.js,.mjs,.cjs)
• HTML (.html,.htm)
• CSS (.css)

Why Use minifix?

minifix is designed to be a one-stop solution for all your minification needs. Whether you’re working on a small project or a large-scale application, minifix can help you optimize your code and improve performance. Its live file-watching feature ensures that your files are always up-to-date, and its configurable options give you full control over the minification process.

Contributing to minifix

minifix is an open-source project, and we welcome contributions from the community. If you encounter any issues or have suggestions for new features, feel free to open an issue on the GitHub repository. If you’d like to contribute code, you can fork the repository and submit a pull request.

Conclusion

minifix is a powerful and flexible tool that simplifies the process of minifying JavaScript, CSS, and HTML files. Whether you’re a seasoned developer or just starting out, minifix can help you optimize your code and improve the performance of your web applications. Try it out and share your feedback with us!

For more information, check out the minifix GitHub repository.