diff options
Diffstat (limited to 'config')
| -rw-r--r-- | config/webpack.config.js | 41 | ||||
| -rw-r--r-- | config/webpack/loader/dynamic-imports-loader.js | 4 | ||||
| -rw-r--r-- | config/webpack/plugins/create-manifest-webpack-plugin/index.js | 4 | ||||
| -rw-r--r-- | config/webpack/plugins/inject-script-webpack-plugin.js | 24 | ||||
| -rw-r--r-- | config/webpack/utils/file-name-hash.js | 10 | ||||
| -rw-r--r-- | config/webpack/utils/scripts.js | 1 | ||||
| -rw-r--r-- | config/webpack/utils/shared-modules.js | 2 |
7 files changed, 60 insertions, 26 deletions
diff --git a/config/webpack.config.js b/config/webpack.config.js index 206eea1..010a51f 100644 --- a/config/webpack.config.js +++ b/config/webpack.config.js @@ -6,6 +6,7 @@ const CopyPlugin = require("copy-webpack-plugin"); global.ROOT_DIR = path.resolve(__dirname, ".."); global.CONFIG_DIR = path.resolve(ROOT_DIR, "config"); global.SOURCE_DIR = path.resolve(ROOT_DIR, "src"); +global.production = process.env.NODE_ENV === "production"; global.webpackRequire = modulePath => require(path.resolve(CONFIG_DIR, "webpack", modulePath)); @@ -21,24 +22,38 @@ const scripts = webpackRequire("utils/scripts"); const sharedModules = webpackRequire("utils/shared-modules"); const uninjectedScriptEntries = {}; -const injectedScriptEntries = {}; +const injectedAfterScriptEntries = {}; +const injectedBeforeScriptEntries = {}; const sharedModuleEntries = {}; const sharedModuleExternals = {}; for (const scriptPath in scripts) { for (const scriptType in scripts[scriptPath]) { const currentScripts = scripts[scriptPath][scriptType]; - const scriptEntries = scriptType.startsWith("injected") ? injectedScriptEntries : uninjectedScriptEntries; + let scriptEntries; + + switch (scriptType) { + case "injected": + scriptEntries = injectedAfterScriptEntries; + break; + + case "injected-before": + scriptEntries = injectedBeforeScriptEntries; + break; + + default: + scriptEntries = uninjectedScriptEntries; + } scriptEntries[`${scriptType} - "${scriptPath}"`] = { import: inlineJavascript(currentScripts.map(script => `import "${path.resolve(SOURCE_DIR, "scripts", script)}";`).join("\n")), - filename: `scripts/${getFileNameHash(scriptPath)}-${scriptType}.js` + filename: `scripts/${getFileNameHash(scriptType, scriptPath)}.js` }; } } for (const sharedModule of sharedModules) { - const sharedModuleNameHash = getFileNameHash(sharedModule); + const sharedModuleNameHash = getFileNameHash(sharedModule, "shared"); sharedModuleEntries[sharedModule] = { import: path.resolve(SOURCE_DIR, "shared", sharedModule), filename: `shared/${sharedModuleNameHash}.js` @@ -110,17 +125,28 @@ const uninjectedScriptConfiguration = merge( } ); -const injectedScriptConfiguration = merge( +const injectedAfterScriptConfiguration = merge( commonOptions, scriptOptions, { - entry: injectedScriptEntries, + entry: injectedAfterScriptEntries, plugins: [ new InjectScriptPlugin() ] } ); +const injectedBeforeScriptConfiguration = merge( + commonOptions, + scriptOptions, + { + entry: injectedBeforeScriptEntries, + plugins: [ + new InjectScriptPlugin(true) + ] + } +); + const sharedModulesConfiguration = merge( commonOptions, ecmaScriptModuleOptions, @@ -137,6 +163,7 @@ const sharedModulesConfiguration = merge( module.exports = [ uninjectedScriptConfiguration, - injectedScriptConfiguration, + injectedAfterScriptConfiguration, + injectedBeforeScriptConfiguration, sharedModulesConfiguration ]; diff --git a/config/webpack/loader/dynamic-imports-loader.js b/config/webpack/loader/dynamic-imports-loader.js index 06f9704..12eb5b7 100644 --- a/config/webpack/loader/dynamic-imports-loader.js +++ b/config/webpack/loader/dynamic-imports-loader.js @@ -5,18 +5,18 @@ const sharedModules = webpackRequire("utils/shared-modules.js"); module.exports = source => { const manager = new ImportManager(source); - let modified = false; for (const unit of manager.imports.es6.units) { const moduleIndex = sharedModules.indexOf(unit.module.name); + if (moduleIndex >= 0 && unit.type === "es6") { const importedModuleNames = unit.members.entities .map(entity => `\t${entity.name}`) .concat(unit.defaultMembers.entities.map(entity => `\tdefault: ${entity.name}`)) .join(",\n"); - const importStatement = `const {\n${importedModuleNames}\n} = await import(/* webpackIgnore: true */ "/shared/${getFileNameHash(sharedModules[moduleIndex])}.js");\n`; + const importStatement = `const {\n${importedModuleNames}\n} = await import(/* webpackIgnore: true */ "/shared/${getFileNameHash(sharedModules[moduleIndex], "shared")}.js");\n`; unit.methods = { makeUntraceable() {} diff --git a/config/webpack/plugins/create-manifest-webpack-plugin/index.js b/config/webpack/plugins/create-manifest-webpack-plugin/index.js index 4ab363f..785d604 100644 --- a/config/webpack/plugins/create-manifest-webpack-plugin/index.js +++ b/config/webpack/plugins/create-manifest-webpack-plugin/index.js @@ -29,7 +29,7 @@ class CreateManifestPlugin { manifest.content_scripts.push({ matches, - js: [`scripts/${getFileNameHash(scriptPath)}-${scriptType}.js`], + js: [`scripts/${getFileNameHash(scriptType, scriptPath)}.js`], run_at: getScriptRuntimeFromType(scriptType) }); } @@ -44,7 +44,7 @@ class CreateManifestPlugin { } for (const sharedModule of sharedModules) { - resources.push(`shared/${getFileNameHash(sharedModule)}.js`); + resources.push(`shared/${getFileNameHash(sharedModule, "shared")}.js`); } if (resources.length > 0) { diff --git a/config/webpack/plugins/inject-script-webpack-plugin.js b/config/webpack/plugins/inject-script-webpack-plugin.js index 862b3f0..c597e9a 100644 --- a/config/webpack/plugins/inject-script-webpack-plugin.js +++ b/config/webpack/plugins/inject-script-webpack-plugin.js @@ -3,6 +3,10 @@ const { sources } = require("webpack"); const { getInjectionCode } = webpackRequire("utils/get-injection-code"); class InjectScriptPlugin { + constructor(insertedBefore = false) { + this.insertedBefore = insertedBefore; + } + apply(compiler) { compiler.hooks.compilation.tap("InjectScriptPlugin", compilation => { compilation.hooks.processAssets.tapPromise( @@ -13,21 +17,15 @@ class InjectScriptPlugin { }, async assets => { for (const assetName in assets) { - let injected = false; - let injected_before = false; - - if (assetName.endsWith("injected.js")) - injected = true; - - else if (assetName.endsWith("injected-before.js")) { - injected = true; - injected_before = true; - } - - if (injected) { + if (/\.js$/.test(assetName)) { compilation.updateAsset( assetName, - new sources.RawSource(getInjectionCode(compilation.getAsset(assetName).source.source(), injected_before)) + new sources.RawSource( + getInjectionCode( + compilation.getAsset(assetName).source.source(), + this.insertedBefore + ) + ) ); } } diff --git a/config/webpack/utils/file-name-hash.js b/config/webpack/utils/file-name-hash.js index e3988a9..889e9a4 100644 --- a/config/webpack/utils/file-name-hash.js +++ b/config/webpack/utils/file-name-hash.js @@ -1,3 +1,11 @@ const crypto = require("crypto"); -module.exports.getFileNameHash = fileName => crypto.createHash("md5").update(fileName).digest("hex").substring(16); +module.exports.getFileNameHash = (fileName, prefix) => { + const finalFileName = `${prefix}-${fileName}`; + const hash = crypto + .createHash("md5") + .update(finalFileName) + .digest("hex"); + + return production ? hash : `${fileName}-${hash.substring(16)}`; +}; diff --git a/config/webpack/utils/scripts.js b/config/webpack/utils/scripts.js index 2196737..427aaab 100644 --- a/config/webpack/utils/scripts.js +++ b/config/webpack/utils/scripts.js @@ -5,6 +5,7 @@ const formattedScripts = {}; for (const scriptType in scripts) { const currentScripts = scripts[scriptType]; + for (const scriptName in currentScripts) { const scriptPath = currentScripts[scriptName]; formattedScripts[scriptPath] = formattedScripts[scriptPath] || {}; diff --git a/config/webpack/utils/shared-modules.js b/config/webpack/utils/shared-modules.js index f10d4a1..974145f 100644 --- a/config/webpack/utils/shared-modules.js +++ b/config/webpack/utils/shared-modules.js @@ -3,6 +3,6 @@ const fs = require("fs"); const sharedModules = fs.readdirSync(path.resolve(SOURCE_DIR, "shared")) .filter(sharedModule => !sharedModule.endsWith("import-shared.js")) - .map(sharedModule => sharedModule.substring(0, sharedModule.length - 3));4 + .map(sharedModule => sharedModule.substring(0, sharedModule.length - 3)); module.exports = sharedModules; |