Reduce build time by manually specifying which icons to copy in bud.c…

…onfig.js
generoi · Sep 8, 2024 · 53d5db8 · 53d5db8
1 parent 599f070
commit 53d5db8
Show file tree

Hide file tree

Showing 10 changed files with 38 additions and 55 deletions.
diff --git a/web/app/themes/gds/bud.config.js b/web/app/themes/gds/bud.config.js
@@ -18,11 +18,31 @@ export default async (app) => {
     .entry('styles/editor-overrides', ['@styles/editor-overrides'])
     .entry('styles/woocommerce', ['@styles/woocommerce'])
     .assets(['images', 'fonts'])
-    .copyFile('jquery.min.js', await app.module.getDirectory(`jquery/dist`))
-    .copyWithoutManifest(
-      'svgs',
-      await app.module.getDirectory(`@fortawesome/fontawesome-pro`),
-    );
+    .copyFile('jquery.min.js', await app.module.getDirectory(`jquery/dist`));
+
+  const fontawesomeDir = await app.module.getDirectory(
+    `@fortawesome/fontawesome-pro`,
+  );
+
+  [
+    'svgs/brands/facebook.svg',
+    'svgs/brands/twitter.svg',
+    'svgs/brands/youtube.svg',
+    'svgs/regular/envelope.svg',
+    'svgs/regular/link.svg',
+    'svgs/regular/share-nodes.svg',
+    'svgs/solid/calendar-week.svg',
+    'svgs/solid/circle-check.svg',
+    'svgs/solid/circle-exclamation.svg',
+    'svgs/solid/circle-info.svg',
+    'svgs/solid/check.svg',
+    'svgs/solid/chevron-down.svg',
+    'svgs/solid/chevron-left.svg',
+    'svgs/solid/chevron-right.svg',
+    'svgs/solid/magnifying-glass.svg',
+    'svgs/solid/star.svg',
+    'svgs/solid/xmark.svg',
+  ].forEach((file) => app.copyFile(file, fontawesomeDir));
 
   app
     .alias('@blocks', resolve('resources/blocks'))

diff --git a/web/app/themes/gds/build/bud-copy-without-manifest.js b/web/app/themes/gds/build/bud-copy-without-manifest.js
diff --git a/web/app/themes/gds/postcss.config.js b/web/app/themes/gds/postcss.config.js
@@ -5,7 +5,7 @@ export default {
   plugins: [
     presetEnv(),
     inlineSvg({
-      paths: ['resources', 'public/svgs'],
+      paths: ['resources', 'public'],
       encode(code) {
         return code
           .replace(/\(/g, '%28')

diff --git a/web/app/themes/gds/resources/blocks/woo-product-tabs/style.scss b/web/app/themes/gds/resources/blocks/woo-product-tabs/style.scss
@@ -109,7 +109,7 @@
       height: 1em;
       display: inline-block;
       text-decoration: none;
-      mask-image: svg-load('solid/star.svg');
+      mask-image: svg-load('svgs/solid/star.svg');
       mask-repeat: no-repeat;
       mask-size: 1em;
       background-color: var(--gds-color-mid-gray);

diff --git a/web/app/themes/gds/resources/styles/blocks/core-post-date.scss b/web/app/themes/gds/resources/styles/blocks/core-post-date.scss
@@ -14,7 +14,7 @@
     display: inline-block;
     width: 1em;
     height: 1em;
-    mask-image: svg-load('solid/calendar-week.svg');
+    mask-image: svg-load('svgs/solid/calendar-week.svg');
     mask-size: contain;
     mask-repeat: no-repeat;
     background: var(--icon-color, var(--gds-color-primary));

diff --git a/web/app/themes/gds/resources/styles/blocks/core-read-more.scss b/web/app/themes/gds/resources/styles/blocks/core-read-more.scss
@@ -18,7 +18,7 @@
     width: 1em;
     height: 1em;
     display: block;
-    mask-image: svg-load('solid/chevron-right.svg');
+    mask-image: svg-load('svgs/solid/chevron-right.svg');
     mask-position: center;
     mask-size: contain;
     mask-repeat: no-repeat;

diff --git a/web/app/themes/gds/resources/styles/blocks/gravityforms-form.scss b/web/app/themes/gds/resources/styles/blocks/gravityforms-form.scss
@@ -408,7 +408,7 @@ img.gform_ajax_spinner {
 
   .ui-icon-circle-triangle-w,
   .ui-icon-circle-triangle-e {
-    mask-image: svg-load('solid/chevron-left.svg');
+    mask-image: svg-load('svgs/solid/chevron-left.svg');
     mask-repeat: no-repeat;
     background-color: currentcolor;
     display: inline-block;
@@ -419,7 +419,7 @@ img.gform_ajax_spinner {
   }
 
   .ui-icon-circle-triangle-e {
-    mask-image: svg-load('solid/chevron-right.svg');
+    mask-image: svg-load('svgs/solid/chevron-right.svg');
   }
 
   &-title {

diff --git a/web/app/themes/gds/resources/styles/components/collapsed-search.scss b/web/app/themes/gds/resources/styles/components/collapsed-search.scss
@@ -44,7 +44,7 @@
 
     &::-webkit-search-cancel-button {
       appearance: none;
-      mask-image: svg-load('solid/xmark.svg');
+      mask-image: svg-load('svgs/solid/xmark.svg');
       mask-size: contain;
       mask-repeat: no-repeat;
       background-color: currentcolor;

diff --git a/web/app/themes/gds/resources/styles/components/form.scss b/web/app/themes/gds/resources/styles/components/form.scss
@@ -34,7 +34,7 @@
 
 @mixin select {
   appearance: none; // safari
-  background-image: svg-load('solid/chevron-down.svg');
+  background-image: svg-load('svgs/solid/chevron-down.svg');
   background-repeat: no-repeat;
   background-position: calc(100% - 16px) center;
   background-size: 14px;

diff --git a/web/app/themes/gds/resources/styles/woocommerce.scss b/web/app/themes/gds/resources/styles/woocommerce.scss
@@ -173,7 +173,7 @@ body.my-account.logged-in .woocommerce {
 .wc-block-review-list-item__rating__stars.wc-block-components-review-list-item__rating__stars.wc-block-review-list-item__rating__stars,
 .wc-block-grid__product-rating__stars.wc-block-grid__product-rating__stars,
 .star-rating.star-rating {
-  mask-image: svg-load('solid/star.svg');
+  mask-image: svg-load('svgs/solid/star.svg');
   mask-repeat: repeat-x;
   mask-size: 1em;
   height: 1em;
@@ -194,7 +194,7 @@ body.my-account.logged-in .woocommerce {
     &::before {
       display: block;
       content: '' !important;
-      mask-image: svg-load('solid/star.svg');
+      mask-image: svg-load('svgs/solid/star.svg');
       mask-repeat: repeat-x;
       mask-size: 1em;
       height: 1em;
@@ -224,7 +224,7 @@ body.my-account.logged-in .woocommerce {
 
   &::before {
     content: '';
-    mask-image: svg-load('solid/circle-check.svg');
+    mask-image: svg-load('svgs/solid/circle-check.svg');
     mask-position: center;
     mask-repeat: no-repeat;
     background: var(--message-color);
@@ -251,15 +251,15 @@ body.my-account.logged-in .woocommerce {
   --message-color: var(--gds-color-primary);
 
   &::before {
-    mask-image: svg-load('solid/circle-info.svg');
+    mask-image: svg-load('svgs/solid/circle-info.svg');
   }
 }
 
 .woocommerce-error {
   --message-color: var(--gds-color-error);
 
   &::before {
-    mask-image: svg-load('solid/circle-exclamation.svg');
+    mask-image: svg-load('svgs/solid/circle-exclamation.svg');
   }
 }