diff options
Diffstat (limited to 'config')
| -rw-r--r-- | config/tsconfig.json | 4 | ||||
| -rw-r--r-- | config/webpack.config.js | 88 | ||||
| -rw-r--r-- | config/webpack/plugins/create-manifest-webpack-plugin/index.js | 12 | ||||
| -rw-r--r-- | config/webpack/utils/format-scripts.js | 15 | ||||
| -rw-r--r-- | config/webpack/utils/get-injection-code.js | 12 | ||||
| -rw-r--r-- | config/webpack/utils/scripts.js | 16 | ||||
| -rw-r--r-- | config/webpack/utils/shared-modules.js | 8 |
7 files changed, 100 insertions, 55 deletions
diff --git a/config/tsconfig.json b/config/tsconfig.json index 7b1d1ef..5a41ca2 100644 --- a/config/tsconfig.json +++ b/config/tsconfig.json @@ -5,7 +5,7 @@ "strict": true, "noImplicitReturns": true, "noImplicitAny": true, - "module": "es6", + "module": "es2022", "moduleResolution": "node", "target": "es2021", "allowJs": true, @@ -14,7 +14,7 @@ "moduleDetection": "force", "baseUrl": "../", "paths": { - "@/*": ["src/*"] + "/shared/*": ["src/shared/*"] } }, "exclude": [ diff --git a/config/webpack.config.js b/config/webpack.config.js index 31d838e..baadc51 100644 --- a/config/webpack.config.js +++ b/config/webpack.config.js @@ -1,4 +1,5 @@ const path = require("path"); +const fs = require("fs"); const CopyPlugin = require("copy-webpack-plugin"); global.ROOT_DIR = path.resolve(__dirname, ".."); @@ -13,57 +14,96 @@ const InjectScriptPlugin = webpackRequire("plugins/inject-script-webpack-plugin" const { inlineJavascript } = webpackRequire("utils/inline-javascript"); const { getScriptRuntimeFromType } = webpackRequire("utils/script-runtime"); const { getFileNameHash } = webpackRequire("utils/file-name-hash"); -const { formatScripts } = webpackRequire("utils/format-scripts"); -const scripts = formatScripts(require(path.resolve(SOURCE_DIR, "scripts.json"))); +const scripts = webpackRequire("utils/scripts"); -const entries = {}; +const sharedModules = webpackRequire("utils/shared-modules"); + +const uninjectedScriptEntries = {}; +const injectedScriptEntries = {}; +const sharedModuleEntries = {}; +const sharedModuleExternals = {}; for (const scriptPath in scripts) { for (const scriptType in scripts[scriptPath]) { const currentScripts = scripts[scriptPath][scriptType]; - entries[`${scriptType} - "${scriptPath}"`] = { + const scriptEntries = scriptType.startsWith("injected") ? injectedScriptEntries : uninjectedScriptEntries; + + scriptEntries[`${scriptType} - "${scriptPath}"`] = { import: inlineJavascript(currentScripts.map(script => `import "${path.resolve(SOURCE_DIR, "scripts", script)}";`).join("\n")), filename: `scripts/${getFileNameHash(scriptPath)}-${scriptType}.js` }; } } -module.exports = { - entry: entries, +for (const sharedModule of sharedModules) { + sharedModuleEntries[sharedModule] = { + import: path.resolve(SOURCE_DIR, "shared", sharedModule), + filename: `shared/${sharedModule}.js`, + library: { + type: "module" + } + }; + sharedModuleExternals[`/shared/${sharedModule}`] = `/shared/${sharedModule}.js`; +} + +const common = { mode: "production", resolve: { - extensions: ["", ".ts", ".js"], + extensions: [".ts", ".js"], alias: { - "@": global.SOURCE_DIR + "/shared": path.resolve(global.SOURCE_DIR, "shared") } }, module: { rules: [ { - test: /\.tsx?$/, + test: /\.ts$/, loader: "ts-loader", options: { configFile: "config/tsconfig.json" } - }, - { - test: /\.(jpg|png|gif)$/, - loader: "url-loader" } ] }, optimization: { minimize: process.env.NODE_ENV === "production" - }, - plugins: [ - new InjectScriptPlugin(), - new CopyPlugin({ - patterns: [{ - from: path.resolve(ROOT_DIR, "static"), - to: "./" - }] - }), - new CreateManifestPlugin() - ] + } }; + +module.exports = [ + { + ...common, + experiments: { + outputModule: true, + topLevelAwait: true + }, + externals: sharedModuleExternals, + entry: uninjectedScriptEntries, + plugins: [ + new CopyPlugin({ + patterns: [{ + from: path.resolve(ROOT_DIR, "static"), + to: "./" + }] + }), + new CreateManifestPlugin() + ] + }, + { + ...common, + entry: injectedScriptEntries, + plugins: [ + new InjectScriptPlugin(), + ] + }, + { + ...common, + externals: sharedModuleExternals, + experiments: { + outputModule: true, + topLevelAwait: true + }, + entry: sharedModuleEntries + } +]; diff --git a/config/webpack/plugins/create-manifest-webpack-plugin/index.js b/config/webpack/plugins/create-manifest-webpack-plugin/index.js index 1940c6e..77f5959 100644 --- a/config/webpack/plugins/create-manifest-webpack-plugin/index.js +++ b/config/webpack/plugins/create-manifest-webpack-plugin/index.js @@ -3,7 +3,9 @@ const path = require("path"); const { getScriptRuntimeFromType } = webpackRequire("utils/script-runtime"); const { getFileNameHash } = webpackRequire("utils/file-name-hash"); -const { formatScripts } = webpackRequire("utils/format-scripts"); +const scripts = webpackRequire("utils/scripts"); +const sharedModules = webpackRequire("utils/shared-modules"); +const manifest = webpackRequire("plugins/create-manifest-webpack-plugin/manifest-template.json"); class CreateManifestPlugin { apply(compiler) { @@ -15,8 +17,6 @@ class CreateManifestPlugin { additionalAssets: true }, assets => { - const scripts = formatScripts(require(path.resolve(SOURCE_DIR, "scripts.json"))); - const manifest = webpackRequire("plugins/create-manifest-webpack-plugin/manifest-template.json"); manifest.version = require(path.resolve(ROOT_DIR, "package.json")).version; manifest.content_scripts = []; @@ -37,9 +37,13 @@ class CreateManifestPlugin { const resources = []; - for (const assetName in assets) + for (const assetName in assets) { if (/^assets\/.*\.(jpg|png|gif)$/.test(assetName)) resources.push(assetName); + } + + for (const sharedModule of sharedModules) + resources.push(`shared/${sharedModule}.js`); if (resources.length > 0) { manifest.web_accessible_resources = [ diff --git a/config/webpack/utils/format-scripts.js b/config/webpack/utils/format-scripts.js deleted file mode 100644 index 0961674..0000000 --- a/config/webpack/utils/format-scripts.js +++ /dev/null @@ -1,15 +0,0 @@ -module.exports.formatScripts = scripts => { - const _scripts = {}; - - for (const scriptType in scripts) { - const currentScripts = scripts[scriptType]; - for (const scriptName in currentScripts) { - const scriptPath = currentScripts[scriptName]; - _scripts[scriptPath] = _scripts[scriptPath] || {}; - _scripts[scriptPath][scriptType] = _scripts[scriptPath][scriptType] || []; - _scripts[scriptPath][scriptType].push(scriptName); - } - } - - return _scripts; -}; diff --git a/config/webpack/utils/get-injection-code.js b/config/webpack/utils/get-injection-code.js index 51d1c20..6333a6a 100644 --- a/config/webpack/utils/get-injection-code.js +++ b/config/webpack/utils/get-injection-code.js @@ -1,18 +1,10 @@ module.exports.getInjectionCode = (code, front) => { - const escapeSequences = [ - ["\b", "\\b"], - ["\f", "\\f"], - ["\n", "\\n"], - ["\r", "\\r"], - ["\t", "\\t"], - ["\v", "\\v"] - ]; + const escapeSequences = ["b", "f", "n", "r", "t", "v"]; let finalCode = code.replaceAll("`","\\`"); for (const escapeSequence of escapeSequences) { finalCode = finalCode - .replaceAll(escapeSequence[1], "\\" + escapeSequence[1]) - .replaceAll(escapeSequence[0], escapeSequence[1]); + .replaceAll("\\" + escapeSequence, "\\\\" + escapeSequence) } const concatenationCode = front diff --git a/config/webpack/utils/scripts.js b/config/webpack/utils/scripts.js new file mode 100644 index 0000000..2196737 --- /dev/null +++ b/config/webpack/utils/scripts.js @@ -0,0 +1,16 @@ +const path = require("path"); +const scripts = require(path.resolve(SOURCE_DIR, "scripts.json")); + +const formattedScripts = {}; + +for (const scriptType in scripts) { + const currentScripts = scripts[scriptType]; + for (const scriptName in currentScripts) { + const scriptPath = currentScripts[scriptName]; + formattedScripts[scriptPath] = formattedScripts[scriptPath] || {}; + formattedScripts[scriptPath][scriptType] = formattedScripts[scriptPath][scriptType] || []; + formattedScripts[scriptPath][scriptType].push(scriptName); + } +} + +module.exports = formattedScripts; diff --git a/config/webpack/utils/shared-modules.js b/config/webpack/utils/shared-modules.js new file mode 100644 index 0000000..f10d4a1 --- /dev/null +++ b/config/webpack/utils/shared-modules.js @@ -0,0 +1,8 @@ +const path = require("path"); +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 + +module.exports = sharedModules; |