Deploy To Netlify Fails With Parcel

I have set up a github account and linked it to a netlify account.
I build a website with parcel-bundler and it keeps failing to build with the same error with a plugin issue. The website works on my local server.

My github site link: https://github.com/nijisijin/webgl-ribbons2.git

I installed parcel-bundler with this: npm install -g parcel-bundler
I’ve tried the build command: npx -p parcel-bundler parcel build index.html
and publish directory: dist/

package.json is :

{
  "name": "webgl-ribbons2",
  "version": "1.0.0",
  "description": "",
  "default": "index.html",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "parcel index.html",
    "dev": "parcel index.html",
    "build": "parcel build index.html"
  },
  "author": "",
  "license": "ISC",
  "browserslist": [
    "last 1 chrome versions"
  ],
  "dependencies": {
    "three": "^0.140.0"
  },
  "devDependencies": {
    "glslify-bundle": "^5.1.1",
    "glslify-deps": "^1.3.2"
  }
}

Namely I get this error::

11:05:28 PM: Waiting for other deploys from your team to complete. Check the queue: https://app.netlify.com/teams/nijisijin/builds
11:06:51 PM: Build ready to start
11:06:53 PM: build-image version: d2c6dbeac570350a387d832f64bc980dc964ad65 (focal)
11:06:53 PM: build-image tag: v4.8.0
11:06:53 PM: buildbot version: 29e546ddee264a16af472b38ccba15b350150213
11:06:53 PM: Building without cache
11:06:53 PM: Starting to prepare the repo for build
11:06:53 PM: No cached dependencies found. Cloning fresh repo
11:06:53 PM: git clone https://github.com/nijisijin/webgl-ribbons2
11:06:58 PM: Preparing Git Reference refs/heads/master
11:06:59 PM: Parsing package.json dependencies
11:07:00 PM: Starting build script
11:07:00 PM: Installing dependencies
11:07:00 PM: Python version set to 2.7
11:07:01 PM: Downloading and installing node v16.15.0...
11:07:01 PM: Downloading https://nodejs.org/dist/v16.15.0/node-v16.15.0-linux-x64.tar.xz...
11:07:01 PM: Computing checksum with sha256sum
11:07:02 PM: Checksums matched!
11:07:04 PM: Now using node v16.15.0 (npm v8.5.5)
11:07:04 PM: Started restoring cached build plugins
11:07:04 PM: Finished restoring cached build plugins
11:07:04 PM: Attempting ruby version 2.7.2, read from environment
11:07:05 PM: Using ruby version 2.7.2
11:07:05 PM: Using PHP version 8.0
11:07:06 PM: No npm workspaces detected
11:07:06 PM: Started restoring cached node modules
11:07:06 PM: Finished restoring cached node modules
11:07:06 PM: Installing NPM modules using NPM version 8.5.5
11:07:09 PM: added 39 packages, and audited 40 packages in 2s
11:07:09 PM: 3 packages are looking for funding
11:07:09 PM:   run `npm fund` for details
11:07:09 PM: found 0 vulnerabilities
11:07:09 PM: NPM modules installed
11:07:09 PM: Started restoring cached go cache
11:07:09 PM: Finished restoring cached go cache
11:07:09 PM: go version go1.16.5 linux/amd64
11:07:09 PM: go version go1.16.5 linux/amd64
11:07:10 PM: Installing missing commands
11:07:10 PM: Verify run directory
11:07:11 PM: ​
11:07:11 PM: ────────────────────────────────────────────────────────────────
11:07:11 PM:   Netlify Build                                                 
11:07:11 PM: ────────────────────────────────────────────────────────────────
11:07:11 PM: ​
11:07:11 PM: ❯ Version
11:07:11 PM:   @netlify/build 27.1.1
11:07:11 PM: ​
11:07:11 PM: ❯ Flags
11:07:11 PM:   baseRelDir: true
11:07:11 PM:   buildId: 62758d98adb05903c979ded0
11:07:11 PM:   deployId: 62758d98adb05903c979ded2
11:07:11 PM: ​
11:07:11 PM: ❯ Current directory
11:07:11 PM:   /opt/build/repo
11:07:11 PM: ​
11:07:11 PM: ❯ Config file
11:07:11 PM:   No config file was defined: using default values.
11:07:11 PM: ​
11:07:11 PM: ❯ Context
11:07:11 PM:   production
11:07:11 PM: ​
11:07:11 PM: ────────────────────────────────────────────────────────────────
11:07:11 PM:   1. Build command from Netlify app                             
11:07:11 PM: ────────────────────────────────────────────────────────────────
11:07:11 PM: ​
11:07:11 PM: $ npx -p parcel-bundler parcel build index.html
11:07:12 PM: npm WARN exec The following package was not found and will be installed: parcel-bundler
11:07:24 PM: npm WARN deprecated source-map-url@0.4.1: See https://github.com/lydell/source-map-url#deprecated
11:07:24 PM: npm WARN deprecated har-validator@5.1.5: this library is no longer supported
11:07:24 PM: npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
11:07:24 PM: npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
11:07:24 PM: npm WARN deprecated source-map-resolve@0.5.3: See https://github.com/lydell/source-map-resolve#deprecated
11:07:25 PM: npm WARN deprecated request-promise-native@1.0.9: request-promise-native has been deprecated because it extends the now deprecated request package, see https://github.com/request/request/issues/3142
11:07:25 PM: npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
11:07:25 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.
11:07:26 PM: npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
11:07:29 PM: npm WARN deprecated chokidar@2.1.8: Chokidar 2 does not receive security updates since 2019. Upgrade to chokidar 3 with 15x fewer dependencies
11:07:30 PM: npm WARN deprecated svgo@1.3.2: This SVGO version is no longer supported. Upgrade to v2.x.x.
11:07:31 PM: npm WARN deprecated parcel-bundler@1.12.5: Parcel v1 is no longer maintained. Please migrate to v2, which is published under the 'parcel' package. See https://v2.parceljs.org/getting-started/migration for details.
11:07:31 PM: npm WARN deprecated core-js@2.6.12: core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.
11:07:37 PM: 
11:07:37 PM: added 69 packages, and audited 109 packages in 2s
11:07:37 PM: 16 packages are looking for funding
11:07:37 PM:   run `npm fund` for details
11:07:37 PM: found 0 vulnerabilities
11:07:38 PM: 
11:07:38 PM: up to date, audited 109 packages in 622ms
11:07:38 PM: 16 packages are looking for funding
11:07:38 PM:   run `npm fund` for details
11:07:38 PM: found 0 vulnerabilities
11:08:06 PM: 🚨  /opt/build/repo/index.html:undefined:undefined: plugin is not a function
11:08:06 PM:     at LazyResult.run (/opt/buildhome/.npm/_npx/e2cf812016c6faed/node_modules/postcss/lib/lazy-result.js:288:14)
11:08:06 PM:     at LazyResult.asyncTick (/opt/buildhome/.npm/_npx/e2cf812016c6faed/node_modules/postcss/lib/lazy-result.js:212:26)
11:08:06 PM:     at /opt/buildhome/.npm/_npx/e2cf812016c6faed/node_modules/postcss/lib/lazy-result.js:254:14
11:08:06 PM:     at new Promise (<anonymous>)
11:08:06 PM:     at LazyResult.async (/opt/buildhome/.npm/_npx/e2cf812016c6faed/node_modules/postcss/lib/lazy-result.js:250:23)
11:08:06 PM:     at LazyResult.then (/opt/buildhome/.npm/_npx/e2cf812016c6faed/node_modules/postcss/lib/lazy-result.js:131:17)
11:08:06 PM: ​
11:08:06 PM: ────────────────────────────────────────────────────────────────
11:08:06 PM:   "build.command" failed                                        
11:08:06 PM: ────────────────────────────────────────────────────────────────
11:08:06 PM: ​
11:08:06 PM:   Error message
11:08:06 PM:   Command failed with exit code 1: npx -p parcel-bundler parcel build index.html (https://ntl.fyi/exit-code-1)
11:08:06 PM: ​
11:08:06 PM:   Error location
11:08:06 PM:   In Build command from Netlify app:
11:08:06 PM:   npx -p parcel-bundler parcel build index.html
11:08:06 PM: ​
11:08:06 PM:   Resolved config
11:08:06 PM:   build:
11:08:06 PM:     command: npx -p parcel-bundler parcel build index.html
11:08:06 PM:     commandOrigin: ui
11:08:06 PM:     publish: /opt/build/repo/dist
11:08:06 PM:     publishOrigin: ui
11:08:07 PM: Caching artifacts
11:08:07 PM: Started saving node modules
11:08:07 PM: Finished saving node modules
11:08:07 PM: Started saving build plugins
11:08:07 PM: Finished saving build plugins
11:08:07 PM: Started saving pip cache
11:08:07 PM: Finished saving pip cache
11:08:07 PM: Started saving emacs cask dependencies
11:08:07 PM: Finished saving emacs cask dependencies
11:08:07 PM: Started saving maven dependencies
11:08:07 PM: Finished saving maven dependencies
11:08:07 PM: Started saving boot dependencies
11:08:07 PM: Finished saving boot dependencies
11:08:07 PM: Started saving rust rustup cache
11:08:07 PM: Finished saving rust rustup cache
11:08:07 PM: Started saving go dependencies
11:08:07 PM: Finished saving go dependencies
11:08:08 PM: Build failed due to a user error: Build script returned non-zero exit code: 2
11:08:08 PM: Creating deploy upload records
11:08:08 PM: Failing build: Failed to build site
11:08:08 PM: Failed during stage 'building site': Build script returned non-zero exit code: 2 (https://ntl.fyi/exit-code-2)
11:08:09 PM: Finished processing build request in 1m15.809445387s

I’d really appreciate it if someone could let me know what should i do for this issue.

Hey @Jin

Looking at the package.json, I suggest changing the build command in the UI to npm run build.

Also, there is no need to push the node_modules directory to git origin as Netlify installs and caches these during build.

I see the same result when trying to build your repository locally too, so this is not a Netlify-specific issue.

The issue is with postcss which is a dependency of cssnano which is automatically installed when running npm run build as the latest CSS Nano uses Post CSS 8 which is incompatible with (I believe) ParcelJS. To overcome this, I added cssnano@4.1.11 as a dependency (npm i cssnano@4.1.11) as v4 uses postcss@7. Once I did this, the build succeeded locally.

If you have any other questions or issues, please don’t hesitate to reply.

1 Like

Hi @coelmay Thank you for the reply.

I have tried your suggest but still keeps failing to build… :smiling_face_with_tear:
What setting did I do wrong to build?


   
{
  "name": "webgl-ribbons2",
  "version": "1.0.0",
  "description": "",
  "default": "index.html",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "parcel index.html",
    "dev": "parcel index.html",
    "build": "parcel build index.html"
  },
  "author": "",
  "license": "ISC",
  "browserslist": [
    "last 1 chrome versions"
  ],
  "dependencies": {
    "cssnano": "^4.1.11",
    "three": "^0.140.0"
  },
  "devDependencies": {
    "glslify-bundle": "^5.1.1",
    "glslify-deps": "^1.3.2"
  }
}

Once again here is the log on Netlify:

8:26:01 PM: ────────────────────────────────────────────────────────────────
8:26:01 PM: ​
8:26:01 PM: $ npm run build
8:26:02 PM: > webgl-ribbons2@1.0.0 build
8:26:02 PM: > parcel build index.html
8:25:25 PM: Build ready to start
8:25:28 PM: build-image version: d2c6dbeac570350a387d832f64bc980dc964ad65 (focal)
8:25:28 PM: build-image tag: v4.8.0
8:25:28 PM: buildbot version: 29e546ddee264a16af472b38ccba15b350150213
8:25:28 PM: Fetching cached dependencies
8:25:28 PM: Failed to fetch cache, continuing with build
8:25:28 PM: Starting to prepare the repo for build
8:25:29 PM: No cached dependencies found. Cloning fresh repo
8:25:29 PM: git clone https://github.com/nijisijin/webgl-ribbons2
8:25:36 PM: Preparing Git Reference refs/heads/master
8:25:36 PM: Parsing package.json dependencies
8:25:38 PM: Starting build script
8:25:38 PM: Installing dependencies
8:25:38 PM: Python version set to 2.7
8:25:39 PM: Downloading and installing node v16.15.0...
8:25:40 PM: Downloading https://nodejs.org/dist/v16.15.0/node-v16.15.0-linux-x64.tar.xz...
8:25:40 PM: Computing checksum with sha256sum
8:25:41 PM: Checksums matched!
8:25:44 PM: Now using node v16.15.0 (npm v8.5.5)
8:25:44 PM: Started restoring cached build plugins
8:25:45 PM: Finished restoring cached build plugins
8:25:45 PM: Attempting ruby version 2.7.2, read from environment
8:25:47 PM: Using ruby version 2.7.2
8:25:47 PM: Using PHP version 8.0
8:25:48 PM: No npm workspaces detected
8:25:48 PM: Started restoring cached node modules
8:25:48 PM: Finished restoring cached node modules
8:25:49 PM: Installing NPM modules using NPM version 8.5.5
8:25:56 PM: npm WARN deprecated svgo@1.3.2: This SVGO version is no longer supported. Upgrade to v2.x.x.
8:25:58 PM: added 223 packages, and audited 224 packages in 9s
8:25:58 PM: 44 packages are looking for funding
8:25:58 PM:   run `npm fund` for details
8:25:58 PM: 6 moderate severity vulnerabilities
8:25:58 PM: To address all issues (including breaking changes), run:
8:25:58 PM:   npm audit fix --force
8:25:58 PM: Run `npm audit` for details.
8:25:58 PM: NPM modules installed
8:25:59 PM: Started restoring cached go cache
8:25:59 PM: Finished restoring cached go cache
8:25:59 PM: go version go1.16.5 linux/amd64
8:25:59 PM: go version go1.16.5 linux/amd64
8:25:59 PM: Installing missing commands
8:25:59 PM: Verify run directory
8:26:01 PM: ​
8:26:01 PM: ────────────────────────────────────────────────────────────────
8:26:01 PM:   Netlify Build                                                 
8:26:01 PM: ────────────────────────────────────────────────────────────────
8:26:01 PM: ​
8:26:01 PM: ❯ Version
8:26:01 PM:   @netlify/build 27.1.1
8:26:01 PM: ​
8:26:01 PM: ❯ Flags
8:26:01 PM:   baseRelDir: true
8:26:01 PM:   buildId: 6276b9951bdbbd2ae5829bc5
8:26:01 PM:   deployId: 6276b9951bdbbd2ae5829bc7
8:26:01 PM: ​
8:26:01 PM: ❯ Current directory
8:26:01 PM:   /opt/build/repo
8:26:01 PM: ​
8:26:01 PM: ❯ Config file
8:26:01 PM:   No config file was defined: using default values.
8:26:01 PM: ​
8:26:01 PM: ❯ Context
8:26:01 PM:   production
8:26:01 PM: ​
8:26:01 PM: ────────────────────────────────────────────────────────────────
8:26:01 PM:   1. Build command from Netlify app                             
8:26:02 PM: sh: 1: parcel: not found
8:26:02 PM: ​
8:26:02 PM: ────────────────────────────────────────────────────────────────
8:26:02 PM:   "build.command" failed                                        
8:26:02 PM: ────────────────────────────────────────────────────────────────
8:26:02 PM: ​
8:26:02 PM:   Error message
8:26:02 PM:   Command failed with exit code 127: npm run build (https://ntl.fyi/exit-code-127)
8:26:02 PM: ​
8:26:02 PM:   Error location
8:26:02 PM:   In Build command from Netlify app:
8:26:02 PM:   npm run build
8:26:02 PM: ​
8:26:02 PM:   Resolved config
8:26:02 PM:   build:
8:26:02 PM:     command: npm run build
8:26:02 PM:     commandOrigin: ui
8:26:02 PM:     publish: /opt/build/repo/dist
8:26:02 PM:     publishOrigin: ui
8:26:03 PM: Caching artifacts
8:26:03 PM: Started saving node modules
8:26:03 PM: Finished saving node modules
8:26:03 PM: Started saving build plugins
8:26:03 PM: Finished saving build plugins
8:26:03 PM: Started saving pip cache
8:26:03 PM: Finished saving pip cache
8:26:03 PM: Started saving emacs cask dependencies
8:26:03 PM: Finished saving emacs cask dependencies
8:26:03 PM: Started saving maven dependencies
8:26:03 PM: Finished saving maven dependencies
8:26:03 PM: Started saving boot dependencies
8:26:03 PM: Finished saving boot dependencies
8:26:03 PM: Started saving rust rustup cache
8:26:03 PM: Finished saving rust rustup cache
8:26:03 PM: Started saving go dependencies
8:26:03 PM: Finished saving go dependencies
8:26:04 PM: Build failed due to a user error: Build script returned non-zero exit code: 2
8:26:04 PM: Creating deploy upload records
8:26:05 PM: Failing build: Failed to build site
8:26:05 PM: Failed during stage 'building site': Build script returned non-zero exit code: 2 (https://ntl.fyi/exit-code-2)
8:26:05 PM: Finished processing build request in 37.018647452s

Thanks for your help even though this is not a Netlify issue.

[solved] i have tried the build command with β€œnpx -p parcel-bundler parcel build index.html” and it works.

Thank you for your help @coelmay