PostCSS Error On Build (Tailwind CSS)

support
1

Hello,

I am trying to run Hugo on a production server and it keeps failing. I’ve tried all sorts now to no avail. This builds perfectly fine locally. The error I am getting is as follows:

Error: Error building site: POSTCSS: failed to transform "css/main.scss" (text/x-scss): TypeError: Object.entries(...).flatMap is not a function

I read online that Node 11 was an issue as flatMap was introduced in V12 but I’ve tried with 12/14/16 and get the same error.

In my HTML file I am doing the following:

{ $styles := resources.Get "css/main.scss" | postCSS }}

    {{ if .Site.IsServer }}
    {{ $styles := $styles | resources.ToCSS }}
    <link rel="stylesheet" href="{{ $styles.RelPermalink }}" />
    {{ else }}

    {{ $styles := $styles | resources.ToCSS | minify | fingerprint | resources.PostProcess }}
    <link rel="stylesheet" href="{{ $styles.RelPermalink }}" integrity="{{ $styles.Data.Integrity }}" />
    {{ end }}

Using just the postcss-cli on the server works fine so what is the Hugo command doing in the background differently that would be causing this to happen?

This also happens on a brand new fresh Digital Ocean droplet where all I’ve done is install Node, Hugo and pull the repo and try to run Hugo.

2

I first thought it might be something in your SCSS files and not node related. Anyway - did you delete the resources folder AFTER you changed from node 11 to 12/14/16? If not, delete that folder, because it caches things and it might have cached the part that throws errors.

Is there any difference between your local config and production config?

Last idea (without a testing repo it’s a blackbox): Delete package-lock.json and node_modules and re-rung npm install and retry. Check the versions in your package.json (I use npm-check-updates which updates the packages safely to the latest versions).

3

Hi David,

Yeah tried all those. In fact, I just did a test with this TailWindCSS skeleton to check it wasn’t an issue with my SCSS and the same error occurs:

I was never on Node 11, it was 12 to start with. I am using Snap to install Hugo on this Linux server (I believe that’s the only way?)

4

I am not sure about Digital Ocean droplets, but there are deb and rpm packages for Hugo without the need to use Snap. Check the repo releases: Release v0.83.1 · gohugoio/hugo · GitHub

One thing I forgot to mention: Did you install --channel=extended (not tested, but pretty sure that is the one) with Snap? without you might miss some parts of the pipeline system. And I remember reading recently here on the forum that the snap version comes with it’s own node packaged.

5

Yes --extended is installed. Ah if snap comes with its own node version that could well be screwing it up if it is using V11!

6

Hmm, yes, unpopular opinion here: Snap Hugo is for beginners :wink: If you can use one of the packages from the release page, depending on your system, do it. I am running on the .deb file and never had any issues (other than keeping an eye on the releases and manually installing updates, because Ubuntu packages Hugo very seldom up-to-date).

PS: “beginners” in sense of “uncomplicated” setups and requirements.

7

I think you’ve hit the nail on the head with snap and the node version! I’ll install one of the packages instead and try that.

It worked! Thanks for that

Any idea where I can log the bug that Node is out of date for Snap for other people?

8

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.