uglify-js-minify-css-allfiles 2.7.0 → 2.8.0

package/README.md

@@ -13,8 +13,6 @@ You can easily minify all files in a specific folder, with the option to exclude
 - [Installation](#installation)
 - [Features](#features)
 - [Usage](#usage)
-- [Parameters](#parameters)
-- [Options](#options)
 - [Advanced Features](#advanced-features)
   - [Babel Integration](#babel-integration)
   - [PostCSS Processing](#postcss-processing)
@@ -22,7 +20,6 @@ You can easily minify all files in a specific folder, with the option to exclude
   - [Logging System](#logging-system)
   - [Source Maps](#source-maps)
 - [API Reference](#api-reference)
-- [Minification Options](#minification-options)
 - [Contributing](#contributing)
 - [License](#license)
 
@@ -60,6 +57,8 @@ await minifyAll('./src/');
 
 ```js
 import minifyAll from 'uglify-js-minify-css-allfiles';
+import postcssImport from 'postcss-import';
+import postcssMixins from 'postcss-mixins';
 
 await minifyAll('./src/', {
   excludeFolder: 'node_modules',
@@ -82,6 +81,10 @@ await minifyAll('./src/', {
     autoprefixer: {
       grid: true,
     },
+    plugins: [
+      postcssImport(),
+      postcssMixins(),
+    ],
   },
   useLog: {
     logDir: 'logs',
@@ -144,6 +147,7 @@ Process modern CSS features with PostCSS integration:
 - Automatically transpile modern CSS to be compatible with older browsers
 - Support for customizable browser targets
 - Integrated with the CSS minification pipeline
+- **Extensible with any PostCSS plugin**
 
 ```js
 await minifyAll('./src/', {
@@ -162,6 +166,32 @@ await minifyAll('./src/', {
 });
 ```
 
+#### PostCSS Custom Plugins
+
+You can extend the PostCSS pipeline with any additional plugins via the `plugins` option.
+Custom plugins are appended **after** `postcss-preset-env`, so they receive the already-transformed CSS.
+
+```js
+import postcssImport from 'postcss-import';
+import postcssMixins from 'postcss-mixins';
+import postcssCustomMedia from 'postcss-custom-media';
+
+await minifyAll('./src/', {
+  usePostCSS: {
+    browsers: ['Chrome >= 40'],
+    stage: 2,
+    plugins: [
+      postcssImport(),        // Resolve @import rules
+      postcssMixins(),        // Enable CSS mixins
+      postcssCustomMedia(),   // Enable @custom-media queries
+    ],
+  },
+});
+```
+
+> **Note:** Each plugin must be a PostCSS-compatible plugin instance or factory function.
+> Install any extra plugins separately (e.g. `npm i postcss-import`).
+
 ### CSS Example with PostCSS Features
 
 ```css
@@ -249,6 +279,7 @@ await minifyAll('./src/', {
   useJsMap: true,
   useCssMap: true
 });
+```
 
 ## API Reference
 
@@ -261,6 +292,7 @@ Main function to process files.
   - `excludeFolder` (string): Directory to exclude
   - `useBabel` (boolean|object): Babel configuration
   - `usePostCSS` (boolean|object): PostCSS configuration
+    - `plugins` (Array): Additional PostCSS plugins (appended after `postcss-preset-env`)
   - `useLog` (boolean|object): Logging configuration
   - `jsMinifyOptions` (object): JavaScript minification options
   - `cssMinifyOptions` (object): CSS minification options
@@ -287,7 +319,7 @@ The `useBabel` object supports all @babel/preset-env options:
   ignoreBrowserslistConfig: boolean,
   shippedProposals: boolean,
   useAppendTransform: boolean,
-  plugins: Array<string|Array|Function>
+  plugins: Array<string|any[]|Function>
 }
 ```
 
@@ -309,10 +341,18 @@ The `usePostCSS` object supports the following options:
     grid: boolean | 'autoplace' | 'no-autoplace'
     // Other autoprefixer options...
   },
-  plugins: Array  // Additional PostCSS plugins
+  plugins: Array<PostCSSPlugin>  // Additional PostCSS plugins (appended after postcss-preset-env)
 }
 ```
 
+| Option | Type | Default | Description |
+|--------|------|---------|-------------|
+| `browsers` | `string[] \| Object` | `['Chrome >= 40']` | Browser targets passed to postcss-preset-env |
+| `stage` | `0–5` | `2` | CSS feature stage level |
+| `features` | `Object` | see defaults | Granular feature toggles |
+| `autoprefixer` | `Object` | `{ grid: true }` | Autoprefixer options |
+| `plugins` | `Array` | `[]` | Additional PostCSS plugins, appended after `postcss-preset-env` |
+
 ### JavaScript Minification Options
 
 Supports all UglifyJS options:

package/demo.js

@@ -13,6 +13,10 @@ minifyAll('./test/', {
     autoprefixer: {
       grid: true,
     },
+    // Add any PostCSS-compatible plugins here.
+    // Each plugin is appended after postcss-preset-env in the processing pipeline.
+    // Example: plugins: [postcssImport(), postcssMixins()]
+    plugins: [],
   },
   useBabel: {
     targets: 'chrome 40',

package/dist/module.js

@@ -310,7 +310,7 @@ async function processFile(filePath, logger, options) {
  * @property {boolean} [ignoreBrowserslistConfig] - Ignores the browserslist configuration.
  * @property {boolean} [shippedProposals] - Enables support for shipped proposals.
  * @property {boolean} [useAppendTransform] - Enables the append-to-appendChild transform plugin for compatibility with older browsers.
- * @property {Array<string|Array|Function>} [plugins] - Additional Babel plugins to include in the transformation process.
+ * @property {Array<string|any[]|Function>} [plugins] - Additional Babel plugins to include in the transformation process.
  */
 
 /**
@@ -360,7 +360,7 @@ async function processFile(filePath, logger, options) {
  * @property {JSMinifyOptions} [jsMinifyOptions={}] - Options for JavaScript minification.
  * @property {CSSMinifyOptions} [cssMinifyOptions={}] - Options for CSS minification.
  * @property {PostCSSOptions|boolean} [usePostCSS=false] - PostCSS configuration options.
- * @property {string[]|null} [useVersioning=null] - Options for file versioning.
+ * @property {{extensions?: string[]}|null} [useVersioning=null] - Options for file versioning.
  * @property {boolean} [useJsMap=false] - Whether to use JavaScript Map file.
  * @property {boolean} [useCssMap=false] - Whether to use CSS Map file.
  */

package/dist/modules/postcssProcess.js

@@ -34,18 +34,21 @@ const DEFAULT_OPTIONS = {
  */
 export async function processWithPostCSS(content, filePath = '', options = {}) {
   try {
+    // Separate custom plugins from preset-env options
+    const { plugins: customPlugins, ...presetEnvInput } = options;
+
     // Merge options with defaults
     const presetEnvOptions = {
       ...DEFAULT_OPTIONS,
-      ...options,
+      ...presetEnvInput,
     };
 
     // Configure plugins
     const plugins = [postcssPresetEnv(presetEnvOptions)];
 
     // Add any custom plugins from options
-    if (options.plugins && Array.isArray(options.plugins)) {
-      plugins.push(...options.plugins);
+    if (customPlugins && Array.isArray(customPlugins)) {
+      plugins.push(...customPlugins);
     }
 
     // Process the CSS

package/minify.d.ts

@@ -66,7 +66,43 @@ declare module 'uglify-js-minify-css-allfiles' {
     /**
      * Additional Babel plugins to include in the transformation process.
      */
-    plugins?: Array<string | Array | Function>;
+    plugins?: Array<string | any[] | Function>;
+  }
+
+  /**
+   * Configuration options for PostCSS processing.
+   */
+  export interface PostCSSOptions {
+    /**
+     * Target browsers for the CSS compatibility.
+     * Can be an array of browser strings or a browserslist configuration object.
+     */
+    browsers?: string[] | { [key: string]: any };
+
+    /**
+     * CSS features stage level.
+     * @default 2
+     */
+    stage?: 0 | 1 | 2 | 3 | 4 | 5;
+
+    /**
+     * Specific CSS features to enable/disable.
+     */
+    features?: {
+      [key: string]: boolean;
+    };
+
+    /**
+     * Autoprefixer options.
+     */
+    autoprefixer?: {
+      [key: string]: any;
+    };
+
+    /**
+     * Additional PostCSS plugins to use.
+     */
+    plugins?: Array<any>;
   }
 
   /**
@@ -172,6 +208,14 @@ declare module 'uglify-js-minify-css-allfiles' {
      */
     useBabel?: boolean | BabelOptions;
 
+    /**
+     * Enables PostCSS processing of CSS files.
+     * If true, uses default PostCSS settings.
+     * If an object is provided, it should conform to the PostCSSOptions interface.
+     * @default false
+     */
+    usePostCSS?: boolean | PostCSSOptions;
+
     /**
      * Configures logging behavior.
      * If true, uses default logging settings.
@@ -192,6 +236,15 @@ declare module 'uglify-js-minify-css-allfiles' {
      */
     cssMinifyOptions?: CSSMinifyOptions;
 
+    /**
+     * Enables automatic image versioning (cache busting) for image references in JS and CSS files.
+     * Content-based hashing is used for CSS images; random hashes are used for JS image references.
+     */
+    useVersioning?: {
+      /** List of image file extensions to version (e.g. ['.png', '.jpg', '.svg']). */
+      extensions?: string[];
+    };
+
     /**
      * Enables source map generation for JavaScript files during minification.
      * Source maps help with debugging by mapping minified code back to original source code.
@@ -228,12 +281,25 @@ declare module 'uglify-js-minify-css-allfiles' {
    *     useBuiltIns: 'usage',
    *     corejs: 3
    *   },
+   *   usePostCSS: {
+   *     browsers: ['Chrome >= 40'],
+   *     stage: 2,
+   *     features: {
+   *       'nesting-rules': true,
+   *       'custom-properties': true,
+   *       'color-functional-notation': true,
+   *     },
+   *     autoprefixer: {
+   *       grid: true,
+   *     },
+   *     plugins: [],
+   *   },
    *   useLog: {
    *     logLevel: 'warn',
    *     retentionDays: 7
    *   },
-   *   useJsMap: true // Enable source map generation
-   *   useCssMap: true // Enable source map generation
+   *   useJsMap: true,
+   *   useCssMap: true
    * });
    * ```
    */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uglify-js-minify-css-allfiles",
-  "version": "2.7.0",
+  "version": "2.8.0",
   "description": "you will be able to minify all files as same file names which is js or css",
   "main": "minify.js",
   "type": "module",
@@ -53,4 +53,4 @@
     "uglify-js": "^3.19.2",
     "uglify-js-es6": "^2.8.9"
   }
-}
+}