Matrix-Mirrors/schildi-web
1
0
Fork 0
mirror of https://github.com/SchildiChat/element-web.git synced 2024-10-01 01:26:12 -04:00
Code Issues Packages Projects Releases Wiki Activity

Update minification and sourcemap settings on CI builds for sentry (#19583)

Browse Source 
With previous settings, our JS files for develop are so large that sentry's webserver rejects the upload.

* re-enable minification to reduce the size of the files
* update the CI sourcemap setting from eval-source-map to source-map to move the embedded source out of the .js payload and into .js.map files
This commit is contained in:
James Salter 2021-11-03 09:55:28 +00:00 committed by GitHub
parent f9cbdb8aa0
commit d9f72ec0b6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 25 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
webpack.config.js
View File

@ -40,31 +40,34 @@ function getActiveThemes() {
} }
module.exports = (env, argv) => { module.exports = (env, argv) => {
let nodeEnv = argv.mode; // Establish settings based on the environment and args.
if (process.env.CI_PACKAGE) { //
// Don't run minification for CI builds (this is only set for runs on develop) // argv.mode is always set to "production" by yarn build
// We override this via environment variable to avoid duplicating the scripts // (called to build prod, nightly and develop.element.io)
// in `package.json` just for a different mode. // arg.mode is set to "delopment" by yarn start
argv.mode = "development"; // (called by developers, runs the continuous reload script)
// process.env.CI_PACKAGE is set when yarn build is called from scripts/ci_package.sh
// More and more people are using nightly build as their main client // (called to build nightly and develop.element.io)
// Libraries like React have a development build that is useful const nodeEnv = argv.mode;
// when working on the app but adds significant runtime overhead
// We want to use the React production build but not compile the whole
// application to productions standards
nodeEnv = "production";
}
const devMode = nodeEnv !== 'production'; const devMode = nodeEnv !== 'production';
const useHMR = process.env.CSS_HOT_RELOAD === '1' && devMode; const useHMR = process.env.CSS_HOT_RELOAD === '1' && devMode;
const fullPageErrors = process.env.FULL_PAGE_ERRORS === '1' && devMode; const fullPageErrors = process.env.FULL_PAGE_ERRORS === '1' && devMode;
const enableMinification = !devMode;
const development = {}; const development = {};
if (argv.mode === "production") { if (devMode) {
development['devtool'] = 'nosources-source-map'; // High quality, embedded source maps for dev builds
development['devtool'] = "eval-source-map";
} else { } else {
// This makes the sourcemaps human readable for developers. We use eval-source-map if (process.env.CI_PACKAGE) {
// because the plain source-map devtool ruins the alignment. // High quality source maps in separate .map files which include the source. This doesn't bulk up the .js
development['devtool'] = 'eval-source-map'; // payload file size, which is nice for performance but also necessary to get the bundle to a small enough
// size that sentry will accept the upload.
development['devtool'] = 'source-map';
} else {
// High quality source maps in separate .map files which don't include the source
development['devtool'] = 'nosources-source-map';
}
} }
// Resolve the directories for the react-sdk and js-sdk for later use. We resolve these early so we // Resolve the directories for the react-sdk and js-sdk for later use. We resolve these early so we
@ -126,8 +129,8 @@ module.exports = (env, argv) => {
// Minification is normally enabled by default for webpack in production mode, but // Minification is normally enabled by default for webpack in production mode, but
// we use a CSS optimizer too and need to manage it ourselves. // we use a CSS optimizer too and need to manage it ourselves.
minimize: argv.mode === 'production', minimize: enableMinification,
minimizer: argv.mode === 'production' ? [new TerserPlugin({}), new OptimizeCSSAssetsPlugin({})] : [], minimizer: enableMinification ? [new TerserPlugin({}), new OptimizeCSSAssetsPlugin({})] : [],
// Set the value of `process.env.NODE_ENV` for libraries like React // Set the value of `process.env.NODE_ENV` for libraries like React
// See also https://v4.webpack.js.org/configuration/optimization/#optimizationnodeenv // See also https://v4.webpack.js.org/configuration/optimization/#optimizationnodeenv
@ -540,7 +543,7 @@ module.exports = (env, argv) => {
process.env.SENTRY_DSN && process.env.SENTRY_DSN &&
new SentryCliPlugin({ new SentryCliPlugin({
release: process.env.VERSION, release: process.env.VERSION,
include: "./webapp", include: "./webapp/bundles",
}), }),
new webpack.EnvironmentPlugin(['VERSION']), new webpack.EnvironmentPlugin(['VERSION']),
].filter(Boolean), ].filter(Boolean),