Search code examples
functiongatsby

How solve issue TypeError: strings.slice(...).reduce is not a function?


I recently dicovered Gatsby and I want to use this template for my own website: https://github.com/toboko/gatsby-starter-fine

When downloading it, manage to run it http://localhost:8000/ but I get this error which I can escape:

TypeError: strings.slice(...).reduce is not a function

I added my repository here so you can take a look too: https://github.com/melariza/gatsby-starter-fine

Could you take a look and help fix it?

Screenshot of the error: enter image description here

Here's the error text:

TypeError: strings.slice(...).reduce is not a function
css
/Users/mga/Sites/gatsby-starter-fine/.cache/loading-indicator/style.js:5
  2 | 
  3 | function css(strings, ...keys) {
  4 |   const lastIndex = strings.length - 1
> 5 |   return (
  6 |     strings.slice(0, lastIndex).reduce((p, s, i) => p + s + keys[i], ``) +
  7 |     strings[lastIndex]
  8 |   )
View compiled
Style
/Users/mga/Sites/gatsby-starter-fine/.cache/loading-indicator/style.js:14
  11 | const Style = () => (
  12 |   <style
  13 |     dangerouslySetInnerHTML={{
> 14 |       __html: css`
  15 |         :host {
  16 |           --purple-60: #663399;
  17 |           --gatsby: var(--purple-60);
View compiled
▶ 18 stack frames were collapsed.
(anonymous function)
/Users/mga/Sites/gatsby-starter-fine/.cache/app.js:165
  162 |   dismissLoadingIndicator()
  163 | }
  164 | 
> 165 | renderer(<Root />, rootElement, () => {
  166 |   apiRunner(`onInitialClientRender`)
  167 | 
  168 |   // Render query on demand overlay
View compiled

Solution

  • I guess the problem is related to Node and its dependencies. The repository is not an official Gatsby starter and the last commit dates from 3 years ago. Gatsby is now on version 4.14 while the starter is on ^2.0.50. Two major versions happened during the last 3 years only in Gatsby so imagine the rest of the dependencies.

    The starter doesn't contain a .nvmrc file or engine property in the package.json so the Node version that runs that project is unknown. Be aware that if you clone or fork that project, you will have a lot of deprecated dependencies and you'll have several migrations to do (from v2 to v3 and from v3 to v4).

    So my advice is to reject that repository and use one of the officials. If that's not an option, try playing around with the version of Node, starting from 12 onwards, reinstalling the node_modules each time you upgrade or downgrade the version.