Skip to content

Commit

Permalink
modify webpack config to address SVG issue
Browse files Browse the repository at this point in the history
  • Loading branch information
indirectlylit committed Apr 11, 2024
1 parent 0ff2bae commit 496d33c
Showing 1 changed file with 55 additions and 0 deletions.
55 changes: 55 additions & 0 deletions website/docusaurus.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,57 @@ const util = require("util");
const webpack = require("webpack");
const execAsync = util.promisify(require("child_process").exec);

/**
* Modify the svgo configuration (in place) to prevent it from minifying IDs in SVGs
*
* Refs:
* - https://github.com/facebook/docusaurus/issues/8297
* - https://github.com/svg/svgo/issues/1714
* - https://linear.app/foxglove/issue/FG-7251/logos-are-cut-off-on-mcapdev
*
* @param {webpack.Configuration} config
*/
function modifySvgoConfig(config) {
const NEW_SVGO_CONFIG = {
plugins: [
{
name: "preset-default",
params: {
overrides: {
removeTitle: false,
removeViewBox: false,
cleanupIDs: false, // do not change IDs
},
},
},
],
};
// find the svgo config rule and replace it
if (config.module?.rules instanceof Array) {
for (const rule of config.module.rules) {
if (typeof rule === "object" && rule.test?.toString() === "/\\.svg$/i") {
if (rule.oneOf instanceof Array) {
for (const nestedRule of rule.oneOf) {
if (nestedRule.use instanceof Array) {
for (const loader of nestedRule.use) {
if (
typeof loader === "object" &&
/* cspell:disable */
loader.loader === require.resolve("@svgr/webpack")
) {
if (typeof loader.options === "object") {
loader.options.svgoConfig = NEW_SVGO_CONFIG;
}
}
}
}
}
}
}
}
}
}

/** @type {import('@docusaurus/types').Config} */
const config = {
title: "MCAP",
Expand All @@ -34,6 +85,10 @@ const config = {
(_context, _options) => ({
name: "MCAP website custom webpack config",
configureWebpack(config, _isServer, _utils, _content) {
// Update config.module.rules directly.
// (Unclear if this is possible with a mergeStrategy below.)
modifySvgoConfig(config);

return {
mergeStrategy: {
"resolve.extensions": "replace",
Expand Down

0 comments on commit 496d33c

Please sign in to comment.