html-inline-webpack-plugin - npm Package Compare versions

Comparing version 1.0.0-alpha1 to 1.0.0-alpha2

package.json

 {
   "name": "html-inline-webpack-plugin",
   "description": "This webpack plugin package is bundling related HTML files by injecting inline tags.",
-  "version": "1.0.0-alpha1",
+  "version": "1.0.0-alpha2",
   "main": "./dist/index.js",
   "types": "./dist/types/index.d.ts",
   "type": "commonjs",
+  "license": "MIT",
+  "repository": "https://github.com/MTtankkeo/html-inline-webpack-plugin",
+  "author": "Dev Ttangkong",
   "keywords": [
@@ -12,3 +15,6 @@ "webpack",
     "html",
-    "html-inline"
+    "html-inline",
+    "html-optimization",
+    "html-bundling",
+    "inline-assets"
   ],
@@ -15,0 +21,0 @@ "scripts": {

README.md

@@ -8,3 +8,3 @@ <div align="center">
             <th>Version</th>
-            <th>v1.0.0-alpha1</th>
+            <th>v1.0.0-alpha2</th>
           </tr>
@@ -40,3 +40,3 @@ </tbody>
 // In webpack.config.js
-const HTMLInlinePlugin = require("html-inline-webpack-plugin").default;
+const HTMLInlinePlugin = require("html-inline-webpack-plugin");
 
@@ -43,0 +43,0 @@ module.exports = {

src/index.ts

 import { HTMLInlineWebpackPlugin } from "./webpack/webpack_plugin";
 
-export default HTMLInlineWebpackPlugin;
+export = HTMLInlineWebpackPlugin;

src/webpack/webpack_plugin.ts

 import { Compilation, Compiler, sources } from "webpack";
-import { HTMLElement, parse } from "node-html-parser";
+import { parse } from "node-html-parser";
 import { format } from "prettier"
 import path from "path";
 import fs from "fs";
+import { AssetInjector, ScriptAssetInjector, StyleAssetInjector } from "../modules/asset_injector";
 
@@ -14,2 +15,3 @@ /** Signature for the interface that defines option values of [HTMLInlineWebpackPlugin]. */
     inject?: boolean;
+    injectByBlob: boolean;
     inline?: boolean;
@@ -22,4 +24,13 @@ pretty?: boolean;
 export class HTMLInlineWebpackPlugin {
-    constructor(public options: HTMLInlineWebpackPluginOptions) {}
+    private injectors = new Map<string, AssetInjector<any>>();
 
+    constructor(public options: HTMLInlineWebpackPluginOptions) {
+        // TODO: ...
+    }
+
+    applyContext(options: Required<HTMLInlineWebpackPluginOptions>) {
+        this.injectors.set(".js", new ScriptAssetInjector({inline: options.inline}));
+        this.injectors.set(".css", new StyleAssetInjector({inline: options.inline}));
+    }
+
     apply(compiler: Compiler) {
@@ -30,6 +41,17 @@ const mode = compiler.options.mode;
         const inject = this.options?.inject ?? true;
+        const injectByBlob = this.options?.injectByBlob ?? true;
         const inline = this.options?.inline ?? mode == "production";
         const pretty = this.options?.pretty ?? false;
-        const processStage = this.options.processStage ?? "OPTIMIZE_INLINE"
+        const processStage = this.options.processStage ?? "OPTIMIZE_INLINE";
 
+        this.applyContext({
+            template: template,
+            filename: filename,
+            inject: inject,
+            injectByBlob: injectByBlob,
+            inline: inline,
+            pretty: pretty,
+            processStage: processStage
+        });
+
         if (inject && path.extname(template) != ".html") {
@@ -53,3 +75,3 @@ throw new Error("A given path of [template] is not an HTML document file format.");
                     if (inject) {
-                        const injected = this.inject(compilation, data as string, inline);
+                        const injected = this.inject(compilation, data as string);
                         const resulted = pretty ? await format(injected, {parser: "html"}) : injected;
@@ -67,3 +89,3 @@
     /** Inserts the content of assets as inline into a given HTML document in head or body. */
-    inject(compilation: Compilation, docText: string, inline: boolean): string {
+    inject(compilation: Compilation, docText: string): string {
         const document = parse(docText);
@@ -78,26 +100,6 @@ const documentHead = document.getElementsByTagName("head")[0]
         for (const asset in compilation.assets) {
-            if (path.extname(asset) == ".js") { // is javascript
-                const source = compilation.assets[asset].source() as string;
-                const script = new HTMLElement("script", {});
-
-                if (inline) {
-                    script.textContent = source;
-                    compilation.deleteAsset(asset);
-                } else {
-                    script.setAttribute("src", asset);
-                }
-
-                documentHead.appendChild(script);
-            } else if (path.extname(asset) == ".css") { // is style sheet about CSS.
-                const source = compilation.assets[asset].source() as string;
-                const styles = new HTMLElement("style", {});
-
-                if (inline) {
-                    styles.textContent = source;
-                    compilation.deleteAsset(asset);
-                } else {
-                    styles.setAttribute("src", asset);
-                }
-
-                documentHead.appendChild(styles);
+            const source = compilation.assets[asset].source() as string;
+            const active = this.injectors.get(path.extname(asset));
+            if (active) {
+                active.perform({compilation, assetName: asset}, documentHead, source);
             }
@@ -104,0 +106,0 @@ }

tsconfig.json

 {
     "compilerOptions": {
-        "module": "CommonJS",
+        "module": "UMD",
         "target": "ES2022",
@@ -5,0 +5,0 @@ "strict": true,

Fixed alerts

AI-detected possible typosquat

Supply chain risk

AI has identified this package as a potential typosquat of a more popular package. This suggests that the package may be intentionally mimicking another package's name, description, or other metadata.

Found 1 instance in 1 package

No contributors or author data

Maintenance

Package does not specify a list of contributors or an author in package.json.

Found 1 instance in 1 package

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

11022

19.07%

Number of downloads

8

300%

Number of package files

9

28.57%

Lines of code

150

44.23%

Number of low maintenance alerts

1

-50%

Number of medium supply chain risk alerts

0

-100%

No dependency changes