diff --git a/.gitignore b/.gitignore index c42b45b..1e1c233 100644 --- a/.gitignore +++ b/.gitignore @@ -61,4 +61,3 @@ typings/ .next /.idea /.rpt2_cache -/build diff --git a/README.md b/README.md index a40c80a..821ffd1 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,5 @@ +# Fork of: https://github.com/Runjuu/html-inline-css-webpack-plugin + # html-inline-css-webpack-plugin [![MIT Licence](https://badges.frapsoft.com/os/mit/mit.svg?v=103)](https://opensource.org/licenses/mit-license.php) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](https://github.com/Runjuu/html-inline-css-webpack-plugin/pulls) diff --git a/build/index.d.ts b/build/index.d.ts new file mode 100644 index 0000000..77192bd --- /dev/null +++ b/build/index.d.ts @@ -0,0 +1,25 @@ +import { Compiler } from "webpack"; +interface ReplaceConfig { + position?: "before" | "after"; + removeTarget?: boolean; + target: string; + leaveCssFile?: boolean; +} +interface Config { + filter?(fileName: string): boolean; + replace?: ReplaceConfig; +} +export default class Plugin { + private readonly config; + static addStyle(html: string, style: string, replaceConfig: ReplaceConfig): string; + static removeLinkTag(html: string, cssFileName: string): string; + static cleanUp(html: string, replaceConfig: ReplaceConfig): string; + private css; + private html; + constructor(config?: Config); + private filter; + private prepare; + private process; + apply(compiler: Compiler): void; +} +export {}; diff --git a/build/index.js b/build/index.js new file mode 100644 index 0000000..c2fb8f8 --- /dev/null +++ b/build/index.js @@ -0,0 +1,109 @@ +(function (factory) { + if (typeof module === "object" && typeof module.exports === "object") { + var v = factory(require, exports); + if (v !== undefined) module.exports = v; + } + else if (typeof define === "function" && define.amd) { + define(["require", "exports"], factory); + } +})(function (require, exports) { + "use strict"; + Object.defineProperty(exports, "__esModule", { value: true }); + var DEFAULT_REPLACE_CONFIG = { + target: "" + }; + var Plugin = /** @class */ (function () { + function Plugin(config) { + if (config === void 0) { config = {}; } + this.config = config; + this.css = {}; + this.html = {}; + } + Plugin.addStyle = function (html, style, replaceConfig) { + var styleString = ""; + var replaceValues = [styleString, replaceConfig.target]; + if (replaceConfig.position === "after") { + replaceValues.reverse(); + } + html = String(html); + return html.replace(replaceConfig.target, replaceValues.join("")); + }; + Plugin.removeLinkTag = function (html, cssFileName) { + html = String(html); + return html.replace(new RegExp("]+href=['\"]" + cssFileName + "['\"][^>]+(>|/>|>)"), ""); + }; + Plugin.cleanUp = function (html, replaceConfig) { + html = String(html); + return replaceConfig.removeTarget + ? html.replace(replaceConfig.target, "") + : html; + }; + Plugin.prototype.filter = function (fileName) { + if (typeof this.config.filter === "function") { + return this.config.filter(fileName); + } + else { + return true; + } + }; + Plugin.prototype.prepare = function (_a) { + var _this = this; + var assets = _a.assets; + var isCSS = is("css"); + var isHTML = is("html"); + var _b = this.config.replace, replaceConfig = _b === void 0 ? DEFAULT_REPLACE_CONFIG : _b; + Object.keys(assets).forEach(function (fileName) { + if (isCSS(fileName)) { + var isCurrentFileNeedsToBeInlined = _this.filter(fileName); + if (isCurrentFileNeedsToBeInlined) { + _this.css[fileName] = assets[fileName].source(); + if (!replaceConfig.leaveCssFile) { + delete assets[fileName]; + } + } + } + else if (isHTML(fileName)) { + _this.html[fileName] = assets[fileName].source(); + } + }); + }; + Plugin.prototype.process = function (_a, _b) { + var _this = this; + var assets = _a.assets; + var output = _b.output; + var publicPath = (output && output.publicPath) || ""; + var _c = this.config.replace, replaceConfig = _c === void 0 ? DEFAULT_REPLACE_CONFIG : _c; + Object.keys(this.html).forEach(function (htmlFileName) { + var html = _this.html[htmlFileName]; + Object.keys(_this.css).forEach(function (key) { + html = Plugin.addStyle(html, _this.css[key], replaceConfig); + html = Plugin.removeLinkTag(html, publicPath + key); + }); + html = Plugin.cleanUp(html, replaceConfig); + assets[htmlFileName] = { + source: function () { + return html; + }, + size: function () { + return html.length; + } + }; + }); + }; + Plugin.prototype.apply = function (compiler) { + var _this = this; + compiler.hooks.emit.tapAsync("html-inline-css-webpack-plugin", function (compilation, callback) { + _this.prepare(compilation); + _this.process(compilation, compiler.options); + callback(); + }); + }; + return Plugin; + }()); + exports.default = Plugin; + function is(filenameExtension) { + var reg = new RegExp("." + filenameExtension + "$"); + return function (fileName) { return reg.test(fileName); }; + } +}); +//# sourceMappingURL=index.js.map \ No newline at end of file diff --git a/build/index.js.map b/build/index.js.map new file mode 100644 index 0000000..0c5b95f --- /dev/null +++ b/build/index.js.map @@ -0,0 +1 @@ +{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/package.json b/package.json index 2023b9b..b7740c5 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { - "name": "html-inline-css-webpack-plugin", - "version": "1.3.2", + "name": "html-inline-css-webpack-plugin-wilddog", + "version": "1.3.3", "description": "☄️ A webpack plugin for convert external stylesheet to embedded stylesheet, aka document stylesheet", "main": "./build/index.js", "types": "./build/index.d.ts", @@ -9,7 +9,7 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/Runjuu/html-inline-css-webpack-plugin.git" + "url": "git+https://github.com/wilddogdesign/html-inline-css-webpack-plugin.git" }, "keywords": [ "webpack", @@ -26,9 +26,9 @@ "author": "Runjuu", "license": "MIT", "bugs": { - "url": "https://github.com/Runjuu/html-inline-css-webpack-plugin/issues" + "url": "https://github.com/wilddogdesign/html-inline-css-webpack-plugin/issues" }, - "homepage": "https://github.com/Runjuu/html-inline-css-webpack-plugin#readme", + "homepage": "https://github.com/wilddogdesign/html-inline-css-webpack-plugin#readme", "devDependencies": { "@types/webpack": "^4.4.0", "tslib": "^1.9.2", diff --git a/src/index.ts b/src/index.ts index 1662d0f..72119ba 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,57 +1,62 @@ -import { Compiler, Configuration } from 'webpack'; +import { Compiler, Configuration } from "webpack"; type File = { - [key: string]: string + [key: string]: string; }; type Asset = { - source(): string - size(): number + source(): string; + size(): number; }; interface Compilation { - assets: { [key: string]: Asset } + assets: { [key: string]: Asset }; } interface ReplaceConfig { - position?: 'before' | 'after' - removeTarget?: boolean - target: string, - leaveCssFile?: boolean + position?: "before" | "after"; + removeTarget?: boolean; + target: string; + leaveCssFile?: boolean; } interface Config { - filter?(fileName: string): boolean - replace?: ReplaceConfig + filter?(fileName: string): boolean; + replace?: ReplaceConfig; } const DEFAULT_REPLACE_CONFIG: ReplaceConfig = { - target: '' + target: "" }; -export default class Plugin -{ +export default class Plugin { static addStyle(html: string, style: string, replaceConfig: ReplaceConfig) { const styleString = ``; const replaceValues = [styleString, replaceConfig.target]; - if (replaceConfig.position === 'after') { - replaceValues.reverse() + if (replaceConfig.position === "after") { + replaceValues.reverse(); } - return html.replace(replaceConfig.target, replaceValues.join('')); + html = String(html); + + return html.replace(replaceConfig.target, replaceValues.join("")); } static removeLinkTag(html: string, cssFileName: string) { + html = String(html); + return html.replace( new RegExp(`]+href=['"]${cssFileName}['"][^>]+(>|\/>|><\/link>)`), - '', + "" ); } static cleanUp(html: string, replaceConfig: ReplaceConfig) { + html = String(html); + return replaceConfig.removeTarget - ? html.replace(replaceConfig.target, '') + ? html.replace(replaceConfig.target, "") : html; } @@ -62,7 +67,7 @@ export default class Plugin constructor(private readonly config: Config = {}) {} private filter(fileName: string): boolean { - if (typeof this.config.filter === 'function') { + if (typeof this.config.filter === "function") { return this.config.filter(fileName); } else { return true; @@ -70,17 +75,17 @@ export default class Plugin } private prepare({ assets }: Compilation) { - const isCSS = is('css'); - const isHTML = is('html'); + const isCSS = is("css"); + const isHTML = is("html"); const { replace: replaceConfig = DEFAULT_REPLACE_CONFIG } = this.config; - Object.keys(assets).forEach((fileName) => { + Object.keys(assets).forEach(fileName => { if (isCSS(fileName)) { const isCurrentFileNeedsToBeInlined = this.filter(fileName); if (isCurrentFileNeedsToBeInlined) { this.css[fileName] = assets[fileName].source(); if (!replaceConfig.leaveCssFile) { - delete assets[fileName] + delete assets[fileName]; } } } else if (isHTML(fileName)) { @@ -90,13 +95,13 @@ export default class Plugin } private process({ assets }: Compilation, { output }: Configuration) { - const publicPath = (output && output.publicPath) || ''; + const publicPath = (output && output.publicPath) || ""; const { replace: replaceConfig = DEFAULT_REPLACE_CONFIG } = this.config; - Object.keys(this.html).forEach((htmlFileName) => { + Object.keys(this.html).forEach(htmlFileName => { let html = this.html[htmlFileName]; - Object.keys(this.css).forEach((key) => { + Object.keys(this.css).forEach(key => { html = Plugin.addStyle(html, this.css[key], replaceConfig); html = Plugin.removeLinkTag(html, publicPath + key); }); @@ -104,18 +109,25 @@ export default class Plugin html = Plugin.cleanUp(html, replaceConfig); assets[htmlFileName] = { - source() { return html }, - size() { return html.length }, + source() { + return html; + }, + size() { + return html.length; + } }; }); } apply(compiler: Compiler) { - compiler.hooks.emit.tapAsync('html-inline-css-webpack-plugin', (compilation: Compilation, callback: () => void) => { - this.prepare(compilation); - this.process(compilation, compiler.options); - callback(); - }); + compiler.hooks.emit.tapAsync( + "html-inline-css-webpack-plugin", + (compilation: Compilation, callback: () => void) => { + this.prepare(compilation); + this.process(compilation, compiler.options); + callback(); + } + ); } }