refactor(SLB-201): directly load stylesheets in gatsby

AmazeeLabs · Jan 22, 2024 · 8a02150 · 8a02150
1 parent b5e4148
commit 8a02150
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 6 deletions.
diff --git a/apps/website/gatsby-browser.ts b/apps/website/gatsby-browser.ts
@@ -1,5 +1,3 @@
-import './styles.css';
-
 import { registerExecutor } from '@custom/schema';
 import { GatsbyBrowser } from 'gatsby';
 

diff --git a/apps/website/gatsby-config.mjs b/apps/website/gatsby-config.mjs
@@ -46,6 +46,7 @@ export default {
       resolve: '@amazeelabs/gatsby-plugin-static-dirs',
       options: {
         directories: {
+          'node_modules/@custom/ui/build/styles.css': '/styles.css',
           'node_modules/@custom/ui/static/public': '/',
           'node_modules/@custom/decap/dist': '/admin',
           'node_modules/@custom/decap/media': '/media',

diff --git a/apps/website/gatsby-ssr.ts b/apps/website/gatsby-ssr.ts
@@ -1,12 +1,12 @@
-import './styles.css';
-
 import { Locale, registerExecutor } from '@custom/schema';
 import { GatsbySSR } from 'gatsby';
+import React from 'react';
 
 import { drupalExecutor } from './src/utils/drupal-executor';
 
 export const onRenderBody: GatsbySSR['onRenderBody'] = ({
   setHtmlAttributes,
+  setHeadComponents,
   pathname,
 }) => {
   registerExecutor(drupalExecutor(`/graphql`));
@@ -27,4 +27,11 @@ export const onRenderBody: GatsbySSR['onRenderBody'] = ({
       // We don't know the language.
     }
   }
+  setHeadComponents([
+    React.createElement('link', {
+      key: 'styles.css',
+      rel: 'stylesheet',
+      href: '/styles.css',
+    }),
+  ]);
 };
diff --git a/apps/website/package.json b/apps/website/package.json
@@ -39,8 +39,6 @@
   },
   "scripts": {
     "test:static": "tsc --noEmit && eslint '**/*.{ts,tsx,js,jsx}' --ignore-path='./.gitignore'",
-    "prep": "pnpm run prep:styles",
-    "prep:styles": "rm -f styles.css && cp node_modules/@custom/ui/build/styles.css styles.css",
     "build:gatsby": "pnpm build:dotenv && gatsby build",
     "build:dotenv": "rm -rf .env && echo \"DRUPAL_EXTERNAL_URL='$DRUPAL_EXTERNAL_URL'\nDRUPAL_INTERNAL_URL='$DRUPAL_INTERNAL_URL'\" >> .env",
     "rebuild": "gatsby build",