Merge pull request #1304 from dnbexperience/chore/update-gatsby

chore(Portal): update Gatsby

.yarnrc.yml

@@ -37,8 +37,6 @@ packageExtensions:
 plugins:
   - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
     spec: "@yarnpkg/plugin-interactive-tools"
-  - path: .yarn/plugins/plugin-ignore-install-options.cjs
-    spec: packages/dnb-design-system-portal/node_modules/yarn-plugin-ignore-install-options/ignore-install-options-1.0.2.js
 
 pnpMode: loose
 

package.json

@@ -38,6 +38,7 @@
     "node-gyp": "8.4.0"
   },
   "resolutions": {
+    "webpack": "5.61.0",
     "svg2vectordrawable/svgo": "2.3.0",
     "@storybook/preset-ie11@0.0.1": "patch:@storybook/preset-ie11@npm:0.0.1#.yarn/patches/@storybook-preset-ie11-npm-0.0.1-f80c765898"
   },

packages/dnb-design-system-portal/gatsby-config.js

@@ -17,7 +17,7 @@ const siteMetadata = {
 }
 
 const plugins = [
-  {
+  process.env.GATSBY_CLOUD === 'true' && {
     resolve: 'gatsby-plugin-gatsby-cloud',
     options: {},
   },

packages/dnb-design-system-portal/package.json

@@ -5,7 +5,7 @@
   "description": "DNB Design System Portal",
   "license": "SEE LICENSE IN LICENSE FILE",
   "author": "DNB Team & Tobias Høegh",
-  "main": "index.js",
+  "main": "src/docs/index.js",
   "scripts": {
     "build": "NODE_NO_WARNINGS=1 gatsby build --no-uglify",
     "build-ci": "yarn build:version && yarn build --prefix-paths",
@@ -62,7 +62,7 @@
     "@babel/eslint-parser": "7.16.0",
     "@babel/node": "7.16.0",
     "@emotion/cache": "11.5.0",
-    "babel-preset-gatsby": "2.1.0",
+    "babel-preset-gatsby": "2.8.0",
     "camelcase": "6.2.0",
     "cross-env": "7.0.3",
     "current-git-branch": "1.1.0",
@@ -76,24 +76,24 @@
     "eslint-plugin-react-hooks": "next",
     "front-matter": "4.0.2",
     "fs-extra": "10.0.0",
-    "gatsby": "4.1.2",
+    "gatsby": "4.8.0",
     "gatsby-link": "4.1.0",
-    "gatsby-plugin-algolia": "0.25.0",
-    "gatsby-plugin-catch-links": "4.1.0",
+    "gatsby-plugin-algolia": "0.26.0",
+    "gatsby-plugin-catch-links": "4.8.0",
     "gatsby-plugin-emotion": "7.1.0",
-    "gatsby-plugin-gatsby-cloud": "4.1.0",
-    "gatsby-plugin-manifest": "4.1.1",
+    "gatsby-plugin-gatsby-cloud": "4.8.0",
+    "gatsby-plugin-manifest": "4.8.0",
     "gatsby-plugin-mdx": "3.1.1",
     "gatsby-plugin-meta-redirect": "1.1.1",
-    "gatsby-plugin-offline": "5.1.1",
-    "gatsby-plugin-page-creator": "4.1.1",
-    "gatsby-plugin-react-helmet": "5.1.0",
+    "gatsby-plugin-offline": "5.8.0",
+    "gatsby-plugin-page-creator": "4.8.0",
+    "gatsby-plugin-react-helmet": "5.8.0",
     "gatsby-plugin-remove-serviceworker": "1.0.0",
     "gatsby-plugin-sass": "5.1.1",
-    "gatsby-plugin-sharp": "4.1.1",
-    "gatsby-react-router-scroll": "5.1.0",
-    "gatsby-remark-images": "6.1.1",
-    "gatsby-source-filesystem": "4.1.0",
+    "gatsby-plugin-sharp": "4.8.0",
+    "gatsby-react-router-scroll": "5.8.0",
+    "gatsby-remark-images": "6.8.0",
+    "gatsby-source-filesystem": "4.8.0",
     "github-slugger": "1.4.0",
     "is-absolute-url": "4.0.1",
     "jest": "27.3.1",
@@ -121,15 +121,11 @@
     "stylelint-config-styled-components": "0.1.1",
     "stylelint-processor-styled-components": "1.10.0",
     "svg-react-loader": "0.4.6",
-    "typescript": "4.5.5",
-    "yarn-plugin-ignore-install-options": "1.0.2"
+    "typescript": "4.5.5"
   },
   "buildVersion": "[LOCAL BUILD]",
   "releaseVersion": "[LOCAL BUILD]",
   "changelogVersion": "[LOCAL BUILD]",
-  "installConfig": {
-    "hoistingLimits": "dependencies"
-  },
   "volta": {
     "extends": "../../package.json"
   }

packages/dnb-design-system-portal/src/docs/contribute/faq.md

@@ -15,7 +15,9 @@ Create a file called `.env.local` in the root of the repo (side-by-side to the .
 LINT_STAGED=1
 ```
 
-## Issue: node-sass vs sass
+## Dependency issues
+
+### node-sass vs sass
 
 The Portal (documentations) uses dart based `sass`, while the bundle and build process of the package `@dnb/eufemia` uses `node-sass` – because:
 
@@ -38,7 +40,7 @@ The Portal (documentations) uses dart based `sass`, while the bundle and build p
 
 - v14 has changed a good amount of their default styling rules. Updating would require us to refactor a good amount of SCSS code. We are currently on v13.
 
-## Issue: Storybook
+### Storybook
 
 The Storybook setup is using the default `@storybook/preset-scss` addon with the recommended dependencies. But for some reason, we can't use the latest versions of the following dependencies:
 
@@ -50,7 +52,17 @@ We get else this error:
 
 > Type Error: this.getOptions is not a function for style-loader
 
-## Issue: Yarn PnP
+### Gatsby Cloud
+
+The plugin `gatsby-plugin-gatsby-cloud` relays on a newer Webpack version than other plugins. In order to let the Portal run on the latest version, we set the yarn resolutions:
+
+```json
+"resolutions": {
+  "webpack": "5.61.0"
+}
+```
+
+### Yarn PnP
 
 Currently, Eufemia uses yarn v3 with `node_modules`.
 
@@ -71,7 +83,7 @@ When switching over to Yarn PnP, there are some issues:
 
 ## How can I make faster builds?
 
-In order to make faster local builds, you can:
+This is only meant for "setup testing" purposes! In order to make faster local builds, you can:
 
 - Inside `gatsby-config.js` rename all sourcing from `/docs` to `/docs_dummy`
 

packages/dnb-design-system-portal/src/shared/parts/ListSummaryFromPages.js

@@ -5,7 +5,6 @@ import { P, Anchor, Ul, Li } from '@dnb/eufemia/src/elements'
 import AutoLinkHeader from '../tags/AutoLinkHeader'
 
 const ListSummaryFromDocs = ({ slug, useAsIndex = false }) => {
-  console.log('slug', slug)
   const {
     allMdx: { edges },
   } = useStaticQuery(graphql`

packages/dnb-eufemia/tsconfig.json

@@ -6,6 +6,7 @@
     "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
     "isolatedModules": true,
+    "skipLibCheck": true,
     "types": ["node", "jest"],
     "outDir": "./build",
     "rootDir": ".",