Home
Support Forums

Next Static Site Failing on Build

I am unable to build and deploy my sit for some reason. Below is the error that I am receiving. The site builds locally just fine, but continues to fail on netlify. Some guidance and insight would be appreciated.

8:53:54 PM: Build ready to start
8:53:56 PM: build-image version: fa439ad1ab9393b2c0d449d8d7c033927683f4b0
8:53:56 PM: build-image tag: v4.3.0
8:53:56 PM: buildbot version: d8696ebd1839fd039956b1b6dd4091c4e06ce743
8:53:56 PM: Building without cache
8:53:56 PM: Starting to prepare the repo for build
8:53:57 PM: No cached dependencies found. Cloning fresh repo
8:53:57 PM: git clone https://github.com/MrOdie/wolf-river_2.0
8:54:05 PM: Preparing Git Reference refs/heads/main
8:54:05 PM: Parsing package.json dependencies
8:54:06 PM: Starting build script
8:54:06 PM: Installing dependencies
8:54:06 PM: Python version set to 2.7
8:54:07 PM: Downloading and installing node v16.7.0...
8:54:07 PM: Downloading https://nodejs.org/dist/v16.7.0/node-v16.7.0-linux-x64.tar.xz...
8:54:07 PM: Computing checksum with sha256sum
8:54:07 PM: Checksums matched!
8:54:10 PM: Now using node v16.7.0 (npm v7.20.3)
8:54:10 PM: Started restoring cached build plugins
8:54:10 PM: Finished restoring cached build plugins
8:54:10 PM: Attempting ruby version 2.7.2, read from environment
8:54:11 PM: Using ruby version 2.7.2
8:54:12 PM: Using PHP version 8.0
8:54:12 PM: Started restoring cached node modules
8:54:12 PM: Finished restoring cached node modules
8:54:12 PM: Installing NPM modules using NPM version 7.20.3
8:54:13 PM: npm WARN old lockfile
8:54:13 PM: npm WARN old lockfile The package-lock.json file was created with an old version of npm,
8:54:13 PM: npm WARN old lockfile so supplemental metadata must be fetched from the registry.
8:54:13 PM: npm WARN old lockfile
8:54:13 PM: npm WARN old lockfile This is a one-time fix-up, please be patient...
8:54:13 PM: npm WARN old lockfile
8:54:22 PM: npm WARN deprecated har-validator@5.1.5: this library is no longer supported
8:54:23 PM: npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
8:54:23 PM: npm WARN deprecated uuid@3.4.0: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
8:54:23 PM: npm WARN deprecated querystring@0.2.1: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
8:54:24 PM: npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
8:54:28 PM: npm WARN deprecated tar@2.2.2: This version of tar is no longer supported, and will not receive security updates. Please upgrade asap.
8:56:43 PM: npm ERR! code 1
8:56:43 PM: npm ERR! path /opt/build/repo/node_modules/node-sass
8:56:43 PM: npm ERR! command failed
8:56:43 PM: npm ERR! command sh -c node scripts/build.js
8:56:43 PM: npm ERR! Building: /opt/buildhome/.nvm/versions/node/v16.7.0/bin/node /opt/build/repo/node_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
8:56:43 PM: npm ERR! make: Entering directory '/opt/build/repo/node_modules/node-sass/build'
8:56:43 PM

Hi @sodonnell5214

What version of Node/NPM are you running locally?
If you delete the package-lock.json from your git repository, does that help?
Are you willing to share you git repository so others can test?

NPM = 6.14.12
Node = 14.16.1

I have removed both package-lock.json and node_modules. I’ve not seeing this current issue anymore, after upgrading node-sass. However, the build is failing when it gets to my SCSS Modules.

this is the repo: GitHub - MrOdie/wolf-river_2.0

In assets/components/partials/Blockquote.js you have

import classes from '../../scss/modules/Blockquote.module.scss';

however you need

import classes from '../../scss/modules/blockquote.module.scss';

Remember: The build filesystem is case-sensitive.

Have a look through the rest of your components/pages/etc. and double check name case. (I had a quick look and could not see any others, though you have inconsistent file naming practices.)

1 Like

So what you’re saying is that CSS Modules should be lowercase?

When the filename is lowercase, yes. When is it camelCase like leftOffset.module.scss then you need to reference it as such. If the filename was Blockquote.module.scss you would not have an issue, but as it is blockquote.module.scss you do.

The inconsistency I mentioned is thus:
You have fullwidthcolumn.module.scss (lowercase) then
you have singleColumn.module.scss (camelCase).

Naming is often a personal preference, but whichever preference, keep it consistent.

1 Like

I appreciate it.

I’ve been working on this basic project structure for long enough to forget some of the conventions I’ve used.

However, I’m still receiving this error:

./assets/scss/modules/blockquote.module.scss.webpack[javascript/auto]!=!./node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[3].oneOf[3].use[1]!./node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[3].oneOf[3].use[2]!./node_modules/next/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[3].oneOf[3].use[3]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[3].oneOf[3].use[4]!./assets/scss/modules/blockquote.module.scss

Any idea what’s causing it?

The line following that might hold a clue

Error: Node Sass version 6.0.1 is incompatible with ^4.0.0 || ^5.0.0.

There is a length issue on this topic (Node Sass version 6.0.0 is incompatible with ^4.0.0 || ^5.0.0. · Issue #3103 · sass/node-sass · GitHub) which seems as though it was solved by not using node-sass :thinking: Other options include downgrading node-sass (perhaps to node-sass@5.0.0.)