From cd39bb5aa073286baa053f8458f0af54a4b7313a Mon Sep 17 00:00:00 2001 From: KernelDeimos Date: Mon, 2 Sep 2024 20:50:15 -0400 Subject: [PATCH] fix: fix sourcemap --- src/gui/webpack.config.cjs | 6 +- src/gui/webpack/BaseConfig.cjs | 4 +- src/gui/webpack/EmitPlugin.cjs | 140 +++++++++++++++++---------------- 3 files changed, 76 insertions(+), 74 deletions(-) diff --git a/src/gui/webpack.config.cjs b/src/gui/webpack.config.cjs index 3c1c4fed..b69b9c06 100644 --- a/src/gui/webpack.config.cjs +++ b/src/gui/webpack.config.cjs @@ -1,8 +1,8 @@ const BaseConfig = require('./webpack/BaseConfig.cjs'); -module.exports = { - ...BaseConfig({ env: 'dev' }), +module.exports = async () => ({ + ...(await BaseConfig({ env: 'dev' })), optimization: { minimize: false }, -}; +}); diff --git a/src/gui/webpack/BaseConfig.cjs b/src/gui/webpack/BaseConfig.cjs index 9e0d6365..7c736b35 100644 --- a/src/gui/webpack/BaseConfig.cjs +++ b/src/gui/webpack/BaseConfig.cjs @@ -1,6 +1,6 @@ const path = require('path'); const EmitPlugin = require('./EmitPlugin.cjs'); -module.exports = (options = {}) => { +module.exports = async (options = {}) => { const config = {}; config.entry = [ './src/init_sync.js', @@ -18,7 +18,7 @@ module.exports = (options = {}) => { filename: 'bundle.min.js', }; config.plugins = [ - EmitPlugin({ + await EmitPlugin({ options, dir: path.join(__dirname, '../src/icons'), }), diff --git a/src/gui/webpack/EmitPlugin.cjs b/src/gui/webpack/EmitPlugin.cjs index d631abc1..9e4fd6de 100644 --- a/src/gui/webpack/EmitPlugin.cjs +++ b/src/gui/webpack/EmitPlugin.cjs @@ -1,78 +1,80 @@ const fs = require('fs'); const path = require('path'); const uglifyjs = require('uglify-js'); +const webpack = require('webpack'); -module.exports = ({ dir, options }) => function () { - const compiler = this; - compiler.hooks.emit.tapAsync('EmitPlugin', async (compilation, callback) => { - let prefix_text = ''; - prefix_text += `window.gui_env="${options.env}";\n`; +module.exports = async ({ dir, options }) => { + let prefix_text = ''; + prefix_text += `window.gui_env="${options.env}";\n`; - // ----------------------------------------------- - // Combine all images into a single js file - // ----------------------------------------------- - { - let icons = 'window.icons = [];\n'; - fs.readdirSync(dir).forEach(file => { - // skip dotfiles - if (file.startsWith('.')) - return; - // load image - let buff = new Buffer.from(fs.readFileSync(dir + '/' + file)); - // convert to base64 - let base64data = buff.toString('base64'); - // add to `window.icons` - if (file.endsWith('.png')) - icons += `window.icons['${file}'] = "data:image/png;base64,${base64data}";\n`; - else if (file.endsWith('.svg')) - icons += `window.icons['${file}'] = "data:image/svg+xml;base64,${base64data}";\n`; - }); - prefix_text += icons + '\n'; - } - - // ----------------------------------------------- - // Concat/merge the JS libraries and save them to ./dist/libs.js - // ----------------------------------------------- - { - const lib_paths = require('./libPaths.cjs'); - let js = ''; - for(let i = 0; i < lib_paths.length; i++){ - const file = path.join(__dirname, '../src/lib/', lib_paths[i]); - // js - if(file.endsWith('.js') && !file.endsWith('.min.js')){ - let minified_code = await uglifyjs.minify(fs.readFileSync(file).toString(), {mangle: false}); - if(minified_code && minified_code.code){ - js += minified_code.code; - if(options?.verbose) - console.log('minified: ', file); - } - }else{ - js += fs.readFileSync(file); - if(options?.verbose) - console.log('skipped minification: ', file); - } - - js += '\n\n\n'; - } - prefix_text += js; - } - - // ----------------------------------------------- - // Webpack understands this code better than I do - // ----------------------------------------------- - Object.keys(compilation.assets).forEach((assetName) => { - if (assetName.endsWith('.js')) { - const asset = compilation.assets[assetName]; - const originalSource = asset.source(); - const newSource = `${prefix_text}\n${originalSource}`; - compilation.assets[assetName] = { - source: () => newSource, - size: () => newSource.length, - }; - } + // ----------------------------------------------- + // Combine all images into a single js file + // ----------------------------------------------- + { + let icons = 'window.icons = [];\n'; + fs.readdirSync(dir).forEach(file => { + // skip dotfiles + if (file.startsWith('.')) + return; + // load image + let buff = new Buffer.from(fs.readFileSync(dir + '/' + file)); + // convert to base64 + let base64data = buff.toString('base64'); + // add to `window.icons` + if (file.endsWith('.png')) + icons += `window.icons['${file}'] = "data:image/png;base64,${base64data}";\n`; + else if (file.endsWith('.svg')) + icons += `window.icons['${file}'] = "data:image/svg+xml;base64,${base64data}";\n`; }); + prefix_text += icons + '\n'; + } - console.log('END'); - callback(); + // ----------------------------------------------- + // Concat/merge the JS libraries and save them to ./dist/libs.js + // ----------------------------------------------- + { + const lib_paths = require('./libPaths.cjs'); + let js = ''; + for(let i = 0; i < lib_paths.length; i++){ + const file = path.join(__dirname, '../src/lib/', lib_paths[i]); + // js + if(file.endsWith('.js') && !file.endsWith('.min.js')){ + let minified_code = await uglifyjs.minify(fs.readFileSync(file).toString(), {mangle: false}); + if(minified_code && minified_code.code){ + js += minified_code.code; + if(options?.verbose) + console.log('minified: ', file); + } + }else{ + js += fs.readFileSync(file); + if(options?.verbose) + console.log('skipped minification: ', file); + } + + js += '\n\n\n'; + } + prefix_text += js; + } + + return new webpack.BannerPlugin({ + banner: prefix_text, + raw: true, }); + + // ----------------------------------------------- + // Webpack understands this code better than I do + // ----------------------------------------------- + // Object.keys(compilation.assets).forEach((assetName) => { + // if (assetName.endsWith('.js')) { + // const asset = compilation.assets[assetName]; + // const originalSource = asset.source(); + // const newSource = `${prefix_text}\n${originalSource}`; + // compilation.assets[assetName] = { + // source: () => newSource, + // size: () => newSource.length, + // }; + // } + // }); + + console.log('END'); };