diff options
Diffstat (limited to 'config/webpack')
6 files changed, 35 insertions, 45 deletions
diff --git a/config/webpack/loaders/scoped-loader.js b/config/webpack/loaders/scoped-loader.js index 701afc2..3b68ba6 100644 --- a/config/webpack/loaders/scoped-loader.js +++ b/config/webpack/loaders/scoped-loader.js @@ -1,3 +1,5 @@ -module.exports = source => `(() => { -${source} -})();`; +const path = require("path"); + +module.exports = function (source) { + return `/**\t${path.basename(this.resourcePath)}\t**/\n(() => {\n${source}\n})();` +}; diff --git a/config/webpack/plugins/create-manifest-webpack-plugin/index.js b/config/webpack/plugins/create-manifest-webpack-plugin/index.js index 4a07380..6bbb485 100644 --- a/config/webpack/plugins/create-manifest-webpack-plugin/index.js +++ b/config/webpack/plugins/create-manifest-webpack-plugin/index.js @@ -1,3 +1,4 @@ +const { sources } = require("webpack"); const path = require("path"); const { version } = require(path.resolve(process.env.ROOT_DIR, "package.json")); @@ -34,10 +35,10 @@ class CreateManifestPlugin { compilation.hooks.processAssets.tap( { name: "CreateManifestPlugin", - stage: compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_SIZE, + stage: compiler.webpack.Compilation.PROCESS_ASSETS_ADDITIONAL, additionalAssets: true }, - assets => { + () => { this.manifest.version = version; this.manifest.content_scripts = [] @@ -64,8 +65,10 @@ class CreateManifestPlugin { } } - const { RawSource } = compiler.webpack.sources; - assets["manifest.json"] = new RawSource(Buffer.from(JSON.stringify(this.manifest))); + compilation.updateAsset( + "manifest.json", + new sources.RawSource(JSON.stringify(this.manifest)) + ); } ); }); diff --git a/config/webpack/plugins/inject-script-webpack-plugin.js b/config/webpack/plugins/inject-script-webpack-plugin.js index 6568514..213e691 100644 --- a/config/webpack/plugins/inject-script-webpack-plugin.js +++ b/config/webpack/plugins/inject-script-webpack-plugin.js @@ -1,23 +1,6 @@ const { sources } = require("webpack"); const terser = require("terser"); -const propectualIndexOf = (string, characterList, start) => { - if (start > 0) { - let i = 0; - let x = start; - while (i < characterList.length) { - x = string.indexOf(characterList[i], x + 1); - if (x < 0) { - return -1; - } - i++; - } - return x; - } else { - return -1; - } -}; - class InjectScriptPlugin { constructor({ onload, isFirst }) { this.onload = !!onload; @@ -36,11 +19,11 @@ class InjectScriptPlugin { for (const assetName in assets) { if (assetName.endsWith(".js")) { let currentAssetContent = compilation.getAsset(assetName).source.source(); - let start = ` - const observer = new MutationObserver(mutations => { - const script = document.querySelector("head > script:nth-child(54)"); - if (script) { - script.innerHTML + let start = `(() => { + const o = new MutationObserver(() => { + const s = document.querySelector("head > script:nth-child(54)"); + if (s) { + s.innerHTML `; let end = ""; if (!this.isFirst) { @@ -52,11 +35,11 @@ class InjectScriptPlugin { end += "});"; } end += `\`; - observer.disconnect(); + o.disconnect(); } }); - observer.observe(document, {childList: true, subtree: true}); - `; + o.observe(document, {childList: true, subtree: true}); + })();`; const content = (await terser.minify(currentAssetContent.replaceAll("`", "\\`"))).code; compilation.updateAsset( assetName, diff --git a/config/webpack/plugins/sanitize-scripts-import-webpack-plugin.js b/config/webpack/plugins/sanitize-scripts-import-webpack-plugin.js index 61ce804..37c2cf4 100644 --- a/config/webpack/plugins/sanitize-scripts-import-webpack-plugin.js +++ b/config/webpack/plugins/sanitize-scripts-import-webpack-plugin.js @@ -1,15 +1,13 @@ const { sources } = require("webpack"); -const propectualIndexOf = (string, characterList, start) => { +const perpectualIndexOf = (string, characterList, start) => { if (start > 0) { - let i = 0; let x = start; - while (i < characterList.length) { + for (let i = 0; i < characterList.length; i++) { x = string.indexOf(characterList[i], x + 1); if (x < 0) { return -1; } - i++; } return x; } else { @@ -33,8 +31,8 @@ class SanitizeScriptsImportPlugin { let previouslyEnded = 0; let code = ""; while (true) { - const start = propectualIndexOf(currentAssetContent, ["\n/***/", "\n/***/", "\n"], previouslyEnded + 1); - previouslyEnded = propectualIndexOf(currentAssetContent, ["\n/***/"], start + 1); + const start = perpectualIndexOf(currentAssetContent, ["\n/***/", "\n/***/", "\n"], previouslyEnded + 1); + previouslyEnded = perpectualIndexOf(currentAssetContent, ["\n/***/"], start + 1); if (previouslyEnded < 0) { break; } else { diff --git a/config/webpack/utils/generate-script-build-config.js b/config/webpack/utils/generate-script-build-config.js index f8e1697..a6f9f54 100644 --- a/config/webpack/utils/generate-script-build-config.js +++ b/config/webpack/utils/generate-script-build-config.js @@ -3,10 +3,9 @@ const path = require("path"); const SanitizeScriptsImportPlugin = require("../plugins/sanitize-scripts-import-webpack-plugin"); const InjectScriptPlugin = require("../plugins/inject-script-webpack-plugin"); +const inlineJavascript = require("./inline-javascript"); -const manifest = require(path.resolve(process.env.SOURCE_DIR, "manifest.json")); - -let count = 0; +const scripts = require(path.resolve(process.env.SOURCE_DIR, "scripts.json")); const getImportStatementForScript = script => { const importPath = path.resolve(process.env.SOURCE_DIR, "scripts", script); @@ -14,15 +13,16 @@ const getImportStatementForScript = script => { }; const getVirtualEntry = scriptType => { - const string = Object.keys(manifest[scriptType]).map(getImportStatementForScript).join("\n"); + const importStatements = Object.keys(scripts[scriptType]).map(getImportStatementForScript).join("\n"); - const base64 = Buffer.from(string).toString("base64"); - return `data:text/javascript;base64,${base64}`; + return inlineJavascript(importStatements); } +let injectedScriptsCount = 0; const generateScriptBuildConfig = scriptType => { return { entry: getVirtualEntry(scriptType), + name: scriptType, mode: "production", output: { filename: `${scriptType}.js` @@ -54,7 +54,7 @@ const generateScriptBuildConfig = scriptType => { scriptType.startsWith("injected") ? [new InjectScriptPlugin({ onload: scriptType === "injected_and_loaded", - isFirst: count++ <= 0 + isFirst: injectedScriptsCount++ <= 0 })] : [] ) diff --git a/config/webpack/utils/inline-javascript.js b/config/webpack/utils/inline-javascript.js new file mode 100644 index 0000000..b9348cc --- /dev/null +++ b/config/webpack/utils/inline-javascript.js @@ -0,0 +1,4 @@ +module.exports = code => { + const base64 = Buffer.from(code).toString("base64"); + return `data:text/javascript;base64,${base64}`; +}; |