@auioc/rollup-plugin-html 0.0.0 → 1.1.0

package/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2026 AUIOC.ORG
+Copyright (c) 2022-2026 PCC-Studio
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,9 +1,168 @@
 # @auioc/rollup-plugin-html
 
-## ⚠️ IMPORTANT NOTICE ⚠️
+[![License](https://img.shields.io/github/license/auioc/rollup-plugins?style=flat-square)](https://github.com/auioc/rollup-plugins/blob/main/packages/html/LICENSE)
+[![NPM Version](https://img.shields.io/npm/v/%40auioc%2Frollup-plugin-html?style=flat-square&logo=npm)](https://www.npmjs.com/package/@auioc/rollup-plugin-html)
 
-**This package is created solely for the purpose of setting up OIDC (OpenID Connect) trusted publishing with npm.**
+A Rollup plugin that generates an HTML file from a template, automatically injecting bundled JavaScript and CSS assets.
 
-This is **NOT** a functional package and contains **NO** code.
+Supports external assets, placeholders, conditional stripping, and optional HTML minification.
 
-**Maintained for OIDC setup purposes only**
+## Install
+
+```sh
+npm install --save-dev @auioc/rollup-plugin-html
+```
+
+## Usage
+
+```js
+// rollup.config.js
+import html from '@auioc/rollup-plugin-html';
+
+export default {
+  input: 'src/index.js',
+  output: { file: 'bundle.js', format: 'iife', name: 'bundle' },
+  plugins: [
+    html({
+      template: 'src/index.html',
+    }),
+  ],
+};
+```
+
+## Options
+
+| Option                 | Type                                    | Default                    | Description                                                                                                                                                     |
+| ---------------------- | --------------------------------------- | -------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `template`             | `string`                                |                            | **Required**. Path to the template `.html` file, resolved relative to `process.cwd()`.                                                                          |
+| `output`               | `string`                                | `'index.html'`             | Output file name of the emitted HTML file.                                                                                                                      |
+| `injectStyle`          | `boolean`                               | `true`                     | Whether to inject styles.                                                                                                                                       |
+| `injectScript`         | `boolean` \| `'module'`                 | `true`                     | Whether to inject scripts. Use `'module'` to add `type="module"`.                                                                                               |
+| `external`             | `{ style?: Asset[]; script?: Asset[] }` | `{ }`                      | External assets to inject. Their tags are placed before the bundled ones.                                                                                       |
+| `styleTagPlaceholder`  | `string`                                | `'<!-- inject:style -->'`  | Placeholder comment replaced by CSS tags.                                                                                                                       |
+| `scriptTagPlaceholder` | `string`                                | `'<!-- inject:script -->'` | Placeholder comment replaced by script tags.                                                                                                                    |
+| `stripTag`             | `string`                                | `'strip'`                  | Tag name used for strip comment blocks.                                                                                                                         |
+| `minify`               | `boolean` \| `MinifierOptions`          | `false`                    | Minify the output HTML with [html-minifier-terser](https://www.npmjs.com/package/html-minifier-terser). Pass an object to forward html-minifier-terser options. |
+
+- Asset
+
+    ```typescript
+    type Asset =
+        | string // treated as URL
+        | {
+              url: string;
+              integrity?: string;
+              crossorigin?: 'anonymous' | 'use-credentials';
+          };
+    ```
+
+## How It Works
+
+### 1. Injection
+
+Assets are injected into the template in one of two ways:
+
+- **Using placeholders** (Recommended)
+
+    ```html
+    <!DOCTYPE html>
+    <html>
+      <head>
+       <title>My App</title>
+        <!-- inject:style -->
+      </head>
+      <body>
+        <div id="app"></div>
+        <!-- inject:script -->
+      </body>
+    </html>
+    ```
+
+    The placeholders are configurable via the `styleTagPlaceholder`, `scriptTagPlaceholder` options.
+
+- **Using fallbacks**
+
+    If placeholders are not present, tags are inserted before `</head>` (CSS) or `</body>` (JS) when those tags exist;
+
+    Otherwise they are prepended (CSS) or appended (JS) to the document.
+
+#### Bundled Assets
+
+When the bundle is generated, the plugin collects:
+
+- **CSS assets** (any emitted asset ending in `.css`)
+- **JS chunks** that are entry points (files ending in `.js`)
+
+#### External Assets
+
+Use the `external` option to inject assets that are not produced by Rollup (e.g. CDN scripts, third-party stylesheets).
+
+External tags are always emitted **before** the bundled tags within the same injection slot.
+
+```js
+html({
+    template: 'src/index.html',
+    external: {
+        style: [
+            'https://cdn.example.com/reset.css',
+            {
+                url: 'https://cdn.example.com/theme.css',
+                integrity: 'sha384-...',
+                crossorigin: 'anonymous',
+            },
+        ],
+        script: [
+            'https://cdn.example.com/polyfill.js',
+            {
+                url: 'https://cdn.example.com/vendor.js',
+                integrity: 'sha384-...',
+                crossorigin: 'anonymous',
+            },
+        ],
+    },
+});
+```
+
+### 2. Stripping markup
+
+Content (e.g., development-only markup) within stripping markup (including the markup) will be removed from the final output:
+
+```html
+<!-- strip -->
+<p>This will be removed in the final build.</p>
+<!-- /strip -->
+```
+
+The tag name is configurable via the `stripTag` option.
+
+### 3. Minification
+
+Enable minification to shrink the final HTML:
+
+```js
+html({
+    template: 'src/index.html',
+    minify: true,
+});
+```
+
+Or pass custom options:
+
+```js
+html({
+    template: 'src/index.html',
+    minify: {
+        collapseWhitespace: true,
+        removeComments: true,
+        minifyCSS: true,
+        minifyJS: true,
+    },
+});
+```
+
+See [`html-minifier-terser` options](https://github.com/terser/html-minifier-terser#options-quick-reference) for the full list.
+
+## License
+
+Package `@auioc/rollup-plugin-html` is licensed under the **MIT License**.
+The full license is in the [LICENSE](./LICENSE) file.

package/dist/index.cjs

@@ -0,0 +1,131 @@
+/*!
+ * Package bundle (CJS) of @auioc/rollup-plugin-html
+ * https://github.com/auioc/rollup-plugins/tree/main/packages/html
+ * Generated at 2026-10-24T11:55:55.128Z
+ * Version: v1.1.0 - tag:html@v1.1.0@7188de8e
+ * Copyright (C) 2026 AUIOC.ORG
+ * Copyright (C) 2022-2026 PCC-Studio
+ * Licensed under MIT
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var htmlMinifierTerser = require('html-minifier-terser');
+var fs = require('node:fs');
+var Path = require('node:path');
+
+const NAME = 'html';
+const DEFAULT_TERSER_OPTIONS = {
+    collapseWhitespace: true,
+    removeComments: true,
+};
+function styleTag(asset) {
+    if (typeof asset === 'string') {
+        return `<link rel="stylesheet" href="${asset}">`;
+    }
+    const integrity = asset.integrity ? ` integrity="${asset.integrity}"` : '';
+    const crossorigin = asset.crossorigin
+        ? ` crossorigin="${asset.crossorigin}"`
+        : '';
+    return `<link rel="stylesheet" href="${asset.url}"${integrity}${crossorigin}>`;
+}
+function scriptTag(asset, module) {
+    if (typeof asset === 'string') {
+        return `<script ${module ? 'type="module" ' : ''}src="${asset}"></script>`;
+    }
+    const integrity = asset.integrity ? ` integrity="${asset.integrity}"` : '';
+    const crossorigin = asset.crossorigin
+        ? ` crossorigin="${asset.crossorigin}"`
+        : '';
+    return `<script ${module ? 'type="module" ' : ''}src="${asset.url}"${integrity}${crossorigin}></script>`;
+}
+function createHTML(options) {
+    const { template: templateFile, output = 'index.html', injectStyle = true, injectScript = true, styleTagPlaceholder = '<!-- inject:style -->', scriptTagPlaceholder = '<!-- inject:script -->', stripTag = 'strip', minify = false, } = options;
+    let template = '';
+    return {
+        name: NAME,
+        buildStart() {
+            if (!templateFile) {
+                throw new Error('Missing `template` option');
+            }
+            try {
+                const path = Path.resolve(process.cwd(), templateFile);
+                template = fs.readFileSync(path, 'utf-8');
+            }
+            catch (error) {
+                this.error(String(error));
+            }
+        },
+        async generateBundle(outputOptions, bundle) {
+            let html = template;
+            // Remove <!-- strip --> ... <!-- /strip -->
+            const stripRegex = new RegExp(`<!--\\s*${stripTag}\\s*-->[\\s\\S]*?<!--\\s*/${stripTag}\\s*-->`, 'g');
+            html = html.replace(stripRegex, '');
+            const jsFiles = [];
+            const cssFiles = [];
+            for (const [fileName, chunk] of Object.entries(bundle)) {
+                if (chunk.type === 'chunk' && fileName.endsWith('.js')) {
+                    if (chunk.isEntry) {
+                        jsFiles.push(fileName);
+                    }
+                }
+                else if (chunk.type === 'asset') {
+                    if (fileName.endsWith('.css')) {
+                        cssFiles.push(fileName);
+                    }
+                }
+            }
+            const external = options.external ?? { style: [], script: [] };
+            if (injectStyle) {
+                const externalTags = (external.style ?? []).map(styleTag);
+                const bundledTags = cssFiles.map(styleTag);
+                const tags = [...externalTags, ...bundledTags].join('\n');
+                if (tags) {
+                    if (html.includes(styleTagPlaceholder)) {
+                        html = html.replace(styleTagPlaceholder, tags);
+                    }
+                    else if (html.includes('</head>')) {
+                        html = html.replace('</head>', `  ${tags}\n</head>`);
+                    }
+                    else {
+                        html = `${tags}\n${html}`;
+                    }
+                }
+            }
+            if (injectScript) {
+                const _toScriptTag = (asset) => scriptTag(asset, injectScript === 'module');
+                const externalTags = (external.script ?? []).map(_toScriptTag);
+                const bundledScriptTags = jsFiles.map(_toScriptTag);
+                const tags = [...externalTags, ...bundledScriptTags].join('\n');
+                if (tags) {
+                    if (html.includes(scriptTagPlaceholder)) {
+                        html = html.replace(scriptTagPlaceholder, tags);
+                    }
+                    else if (html.includes('</body>')) {
+                        html = html.replace('</body>', `  ${tags}\n</body>`);
+                    }
+                    else {
+                        html += `\n${tags}`;
+                    }
+                }
+            }
+            if (minify) {
+                const minifyOptions = typeof minify === 'object'
+                    ? minify
+                    : DEFAULT_TERSER_OPTIONS;
+                html = await htmlMinifierTerser.minify(html, minifyOptions);
+            }
+            const asset = {
+                type: 'asset',
+                fileName: output,
+                name: output,
+                source: html,
+                needsCodeReference: false,
+            };
+            this.emitFile(asset);
+        },
+    };
+}
+
+exports.default = createHTML;

package/dist/index.d.ts

@@ -0,0 +1,74 @@
+/*!
+ * Type definitions of @auioc/rollup-plugin-html
+ * https://github.com/auioc/rollup-plugins/tree/main/packages/html
+ * Generated at 2026-10-24T11:55:55.128Z
+ * Version: v1.1.0 - tag:html@v1.1.0@7188de8e
+ * Copyright (C) 2026 AUIOC.ORG
+ * Copyright (C) 2022-2026 PCC-Studio
+ * Licensed under MIT
+ */
+import { Options as Options$1 } from 'html-minifier-terser';
+import { Plugin } from 'rollup';
+
+type Asset = string | {
+    url: string;
+    integrity?: string;
+    crossorigin?: 'anonymous' | 'use-credentials';
+};
+interface Options {
+    /**
+     * Path of template `.html` file
+     */
+    template: string;
+    /**
+     * Output file name
+     * @default 'index.html'
+     */
+    output?: string;
+    /**
+     * Whether to inject bundled CSS files.
+     * @default true
+     */
+    injectStyle?: boolean;
+    /**
+     * Whether to inject bundled JS files.
+     * Use `'module'` to add `type="module"`.
+     * @default true
+     */
+    injectScript?: boolean | 'module';
+    /**
+     * External assets to inject.
+     * @default {}
+     */
+    external?: {
+        style?: Asset[];
+        script?: Asset[];
+    };
+    /**
+     * Placeholder comment replaced by CSS tags.
+     * @default '<!-- inject:style -->'
+     */
+    styleTagPlaceholder?: string;
+    /**
+     * Placeholder comment replaced by script tags.
+     * @default '<!-- inject:script -->'
+     */
+    scriptTagPlaceholder?: string;
+    /**
+     * Tag name used for strip comment blocks.
+     *
+     * Content within `<!-- strip --><!-- /strip -->` (including the markup) will be removed from the final output.
+     * @default 'strip'
+     */
+    stripTag?: string;
+    /**
+     * Minify the output HTML.
+     * @see {@link MinifierOptions}
+     * @default false
+     */
+    minify?: boolean | Options$1;
+}
+declare function createHTML(options: Options): Plugin;
+
+export { createHTML as default };
+export type { Asset, Options };

package/dist/index.mjs

@@ -0,0 +1,127 @@
+/*!
+ * Package bundle (ESM) of @auioc/rollup-plugin-html
+ * https://github.com/auioc/rollup-plugins/tree/main/packages/html
+ * Generated at 2026-10-24T11:55:55.128Z
+ * Version: v1.1.0 - tag:html@v1.1.0@7188de8e
+ * Copyright (C) 2026 AUIOC.ORG
+ * Copyright (C) 2022-2026 PCC-Studio
+ * Licensed under MIT
+ */
+import { minify } from 'html-minifier-terser';
+import fs from 'node:fs';
+import Path from 'node:path';
+
+const NAME = 'html';
+const DEFAULT_TERSER_OPTIONS = {
+    collapseWhitespace: true,
+    removeComments: true,
+};
+function styleTag(asset) {
+    if (typeof asset === 'string') {
+        return `<link rel="stylesheet" href="${asset}">`;
+    }
+    const integrity = asset.integrity ? ` integrity="${asset.integrity}"` : '';
+    const crossorigin = asset.crossorigin
+        ? ` crossorigin="${asset.crossorigin}"`
+        : '';
+    return `<link rel="stylesheet" href="${asset.url}"${integrity}${crossorigin}>`;
+}
+function scriptTag(asset, module) {
+    if (typeof asset === 'string') {
+        return `<script ${module ? 'type="module" ' : ''}src="${asset}"></script>`;
+    }
+    const integrity = asset.integrity ? ` integrity="${asset.integrity}"` : '';
+    const crossorigin = asset.crossorigin
+        ? ` crossorigin="${asset.crossorigin}"`
+        : '';
+    return `<script ${module ? 'type="module" ' : ''}src="${asset.url}"${integrity}${crossorigin}></script>`;
+}
+function createHTML(options) {
+    const { template: templateFile, output = 'index.html', injectStyle = true, injectScript = true, styleTagPlaceholder = '<!-- inject:style -->', scriptTagPlaceholder = '<!-- inject:script -->', stripTag = 'strip', minify: minify$1 = false, } = options;
+    let template = '';
+    return {
+        name: NAME,
+        buildStart() {
+            if (!templateFile) {
+                throw new Error('Missing `template` option');
+            }
+            try {
+                const path = Path.resolve(process.cwd(), templateFile);
+                template = fs.readFileSync(path, 'utf-8');
+            }
+            catch (error) {
+                this.error(String(error));
+            }
+        },
+        async generateBundle(outputOptions, bundle) {
+            let html = template;
+            // Remove <!-- strip --> ... <!-- /strip -->
+            const stripRegex = new RegExp(`<!--\\s*${stripTag}\\s*-->[\\s\\S]*?<!--\\s*/${stripTag}\\s*-->`, 'g');
+            html = html.replace(stripRegex, '');
+            const jsFiles = [];
+            const cssFiles = [];
+            for (const [fileName, chunk] of Object.entries(bundle)) {
+                if (chunk.type === 'chunk' && fileName.endsWith('.js')) {
+                    if (chunk.isEntry) {
+                        jsFiles.push(fileName);
+                    }
+                }
+                else if (chunk.type === 'asset') {
+                    if (fileName.endsWith('.css')) {
+                        cssFiles.push(fileName);
+                    }
+                }
+            }
+            const external = options.external ?? { style: [], script: [] };
+            if (injectStyle) {
+                const externalTags = (external.style ?? []).map(styleTag);
+                const bundledTags = cssFiles.map(styleTag);
+                const tags = [...externalTags, ...bundledTags].join('\n');
+                if (tags) {
+                    if (html.includes(styleTagPlaceholder)) {
+                        html = html.replace(styleTagPlaceholder, tags);
+                    }
+                    else if (html.includes('</head>')) {
+                        html = html.replace('</head>', `  ${tags}\n</head>`);
+                    }
+                    else {
+                        html = `${tags}\n${html}`;
+                    }
+                }
+            }
+            if (injectScript) {
+                const _toScriptTag = (asset) => scriptTag(asset, injectScript === 'module');
+                const externalTags = (external.script ?? []).map(_toScriptTag);
+                const bundledScriptTags = jsFiles.map(_toScriptTag);
+                const tags = [...externalTags, ...bundledScriptTags].join('\n');
+                if (tags) {
+                    if (html.includes(scriptTagPlaceholder)) {
+                        html = html.replace(scriptTagPlaceholder, tags);
+                    }
+                    else if (html.includes('</body>')) {
+                        html = html.replace('</body>', `  ${tags}\n</body>`);
+                    }
+                    else {
+                        html += `\n${tags}`;
+                    }
+                }
+            }
+            if (minify$1) {
+                const minifyOptions = typeof minify$1 === 'object'
+                    ? minify$1
+                    : DEFAULT_TERSER_OPTIONS;
+                html = await minify(html, minifyOptions);
+            }
+            const asset = {
+                type: 'asset',
+                fileName: output,
+                name: output,
+                source: html,
+                needsCodeReference: false,
+            };
+            this.emitFile(asset);
+        },
+    };
+}
+
+export { createHTML as default };

package/package.json

@@ -1,10 +1,47 @@
 {
   "name": "@auioc/rollup-plugin-html",
-  "version": "0.0.0",
-  "description": "OIDC trusted publishing setup package for @auioc/rollup-plugin-html",
+  "version": "1.1.0",
+  "publishConfig": {
+    "access": "public"
+  },
+  "description": "Rollup plugin - create html file from template to serve bundled js/css",
   "keywords": [
-    "oidc",
-    "trusted-publishing",
-    "setup"
-  ]
-}
+    "rollup",
+    "plugin",
+    "rollup-plugin",
+    "html",
+    "template"
+  ],
+  "license": "MIT",
+  "homepage": "https://github.com/auioc/rollup-plugins/tree/main/packages/html",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/auioc/rollup-plugins.git",
+    "directory": "packages/html"
+  },
+  "author": {
+    "name": "AUIOC",
+    "url": "https://www.auioc.org"
+  },
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    "types": "./dist/index.d.ts",
+    "import": "./dist/index.mjs",
+    "default": "./dist/index.cjs"
+  },
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "html-minifier-terser": "^7.2.0"
+  },
+  "devDependencies": {
+    "@types/html-minifier-terser": "^7.0.2"
+  },
+  "scripts": {
+    "build": "rollup -c"
+  }
+}