Home
Support Forums

Scully/Angular build seems to work locally but not in Netlify

I’m quite sure I’m doing or missing something silly… but I feel as I’ve been going around in circles.

Problem: My build seems to work fine locally but always fails with the same error on Netlify.

The error: Angular distribution files not found, run "ng build" first

Full build log

6:56:33 PM: Build ready to start
6:56:35 PM: build-image version: 0582042f4fc261adc7bd8333f34884959c577302
6:56:35 PM: build-image tag: v3.7.6
6:56:35 PM: buildbot version: 0e23307adb9080898b837c5147a17e2f7890cb10
6:56:35 PM: Fetching cached dependencies
6:56:35 PM: Starting to download cache of 637.0MB
6:56:40 PM: Finished downloading cache in 5.55356885s
6:56:40 PM: Starting to extract cache
6:57:06 PM: Finished extracting cache in 26.027014631s
6:57:06 PM: Finished fetching cache in 31.780339667s
6:57:06 PM: Starting to prepare the repo for build
6:57:07 PM: Preparing Git Reference pull/4/head
6:57:08 PM: Parsing package.json dependencies
6:57:08 PM: Different publish path detected, going to use the one specified in the Netlify configuration file: 'dist/static' versus '' in the Netlify UI
6:57:08 PM: Different build command detected, going to use the one specified in the Netlify configuration file: 'nx build web —prod && yarn run scully' versus '' in the Netlify UI
6:57:08 PM: Starting build script
6:57:08 PM: Installing dependencies
6:57:08 PM: Python version set to 2.7
6:57:09 PM: Started restoring cached node version
6:57:11 PM: Finished restoring cached node version
6:57:12 PM: v12.18.0 is already installed.
6:57:12 PM: Now using node v12.18.0 (npm v6.14.4)
6:57:12 PM: Started restoring cached build plugins
6:57:12 PM: Finished restoring cached build plugins
6:57:13 PM: Attempting ruby version 2.7.1, read from environment
6:57:14 PM: Using ruby version 2.7.1
6:57:14 PM: Using PHP version 5.6
6:57:14 PM: Started restoring cached yarn cache
6:57:14 PM: Finished restoring cached yarn cache
6:57:15 PM: No yarn workspaces detected
6:57:15 PM: Started restoring cached node modules
6:57:15 PM: Finished restoring cached node modules
6:57:15 PM: Installing NPM modules using Yarn version 1.22.4
6:57:15 PM: yarn install v1.22.4
6:57:15 PM: [1/4] Resolving packages...
6:57:16 PM: [2/4] Fetching packages...
6:58:03 PM: info fsevents@2.3.2: The platform "linux" is incompatible with this module.
6:58:03 PM: info "fsevents@2.3.2" is an optional dependency and failed compatibility check. Excluding it from installation.
6:58:03 PM: info fsevents@1.2.13: The platform "linux" is incompatible with this module.
6:58:03 PM: info "fsevents@1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
6:58:03 PM: info @netlify/traffic-mesh-agent-darwin-x64@0.27.10: The platform "linux" is incompatible with this module.
6:58:03 PM: info "@netlify/traffic-mesh-agent-darwin-x64@0.27.10" is an optional dependency and failed compatibility check. Excluding it from installation.
6:58:03 PM: info @netlify/traffic-mesh-agent-win32-x64@0.27.10: The platform "linux" is incompatible with this module.
6:58:03 PM: info "@netlify/traffic-mesh-agent-win32-x64@0.27.10" is an optional dependency and failed compatibility check. Excluding it from installation.
6:58:03 PM: [3/4] Linking dependencies...
6:58:03 PM: warning "@nrwl/angular > @nrwl/cypress > @cypress/webpack-preprocessor@4.1.5" has unmet peer dependency "webpack@^4.18.1".
6:58:03 PM: warning " > @scullyio/init@1.1.4" has unmet peer dependency "guess-parser@^0.4.13".
6:58:03 PM: warning "@scullyio/init > @angular/router@11.0.3" has incorrect peer dependency "@angular/platform-browser@11.0.3".
6:58:03 PM: warning " > jest-preset-angular@8.4.0" has incorrect peer dependency "jest@^26.0.0".
6:58:03 PM: warning "jest-preset-angular > ts-jest@26.5.6" has incorrect peer dependency "jest@>=26 <27".
6:58:03 PM: warning "netlify-schematics > netlify-cli > @octokit/rest > @octokit/plugin-request-log@1.0.3" has unmet peer dependency "@octokit/core@>=3".
6:58:03 PM: warning " > scully-plugin-time-to-read@0.0.4" has unmet peer dependency "reading-time@^1.2.1".
6:58:59 PM: [4/4] Building fresh packages...
6:59:06 PM: $ node ./decorate-angular-cli.js && ngcc --properties es2015 browser module main
6:59:07 PM: >  NX  Angular CLI has been decorated to enable computation caching.
6:59:12 PM: Compiling @angular/core : es2015 as esm2015
6:59:12 PM: Compiling @angular/animations : es2015 as esm2015
6:59:12 PM: Compiling @angular/compiler/testing : es2015 as esm2015
6:59:12 PM: Compiling @nrwl/angular/testing : es2015 as esm2015
6:59:17 PM: Compiling angular-animations : es2015 as esm2015
6:59:19 PM: Compiling @angular/animations : main as umd
6:59:19 PM: Compiling @nrwl/angular/testing : main as umd
6:59:19 PM: Compiling @angular/compiler/testing : main as umd
6:59:20 PM: Compiling angular-animations : main as umd
6:59:24 PM: Compiling @angular/common : es2015 as esm2015
6:59:24 PM: Compiling @nguniversal/express-engine/tokens : es2015 as esm2015
6:59:24 PM: Compiling @angular/core/testing : es2015 as esm2015
6:59:24 PM: Compiling @angular/animations/browser : es2015 as esm2015
6:59:28 PM: Compiling @angular/platform-browser : es2015 as esm2015
6:59:28 PM: Compiling @angular/common/http : es2015 as esm2015
6:59:29 PM: Compiling @angular/router : es2015 as esm2015
6:59:29 PM: Compiling @angular/common/testing : es2015 as esm2015
6:59:30 PM: Compiling @angular/platform-browser-dynamic : es2015 as esm2015
6:59:30 PM: Compiling @angular/platform-browser/animations : es2015 as esm2015
6:59:31 PM: Compiling @angular/platform-browser/testing : es2015 as esm2015
6:59:31 PM: Compiling @ng-web-apis/common : es2015 as esm2015
6:59:32 PM: Compiling @angular/animations/browser/testing : es2015 as esm2015
6:59:32 PM: Compiling @angular/platform-server : es2015 as esm2015
6:59:32 PM: Compiling @angular/platform-browser-dynamic/testing : es2015 as esm2015
6:59:32 PM: Compiling @angular/common/http/testing : es2015 as esm2015
6:59:32 PM: Compiling @angular/forms : es2015 as esm2015
6:59:33 PM: Compiling @angular/platform-server/init : es2015 as esm2015
6:59:34 PM: Compiling @angular/router/testing : es2015 as esm2015
6:59:34 PM: Compiling @ngneat/until-destroy : es2015 as esm2015
6:59:34 PM: Compiling @nguniversal/common/engine : es2015 as esm2015
6:59:35 PM: Compiling @angular/platform-server/testing : es2015 as esm2015
6:59:35 PM: Compiling @nguniversal/common : es2015 as esm2015
6:59:36 PM: Compiling @nguniversal/common/clover : es2015 as esm2015
6:59:36 PM: Compiling @scullyio/ng-lib : es2015 as esm2015
6:59:37 PM: Compiling @angular/animations/browser/testing : main as umd
6:59:37 PM: Compiling @angular/animations/browser : main as umd
6:59:38 PM: Compiling @nguniversal/express-engine : es2015 as esm2015
6:59:38 PM: Compiling @angular/common : main as umd
6:59:38 PM: Compiling @angular/core : main as umd
6:59:39 PM: Compiling @angular/common/http : main as umd
6:59:41 PM: Compiling @angular/common/http/testing : main as umd
6:59:41 PM: Compiling @angular/platform-browser : main as umd
6:59:41 PM: Compiling @angular/forms : main as umd
6:59:41 PM: Compiling @angular/platform-server/init : main as umd
6:59:42 PM: Compiling @angular/core/testing : main as umd
6:59:43 PM: Compiling @angular/platform-browser-dynamic : main as umd
6:59:44 PM: Compiling @angular/platform-browser/testing : main as umd
6:59:44 PM: Compiling @angular/platform-browser-dynamic/testing : main as umd
6:59:45 PM: Compiling @angular/platform-browser/animations : main as umd
6:59:45 PM: Compiling @angular/platform-server : main as umd
6:59:45 PM: Compiling @angular/platform-server/testing : main as umd
6:59:45 PM: Compiling @angular/common/testing : main as umd
6:59:46 PM: Compiling @angular/router/testing : main as umd
6:59:46 PM: Compiling @angular/router : main as umd
6:59:46 PM: Compiling @ng-web-apis/common : module as esm5
6:59:46 PM: Compiling @ng-web-apis/common : main as umd
6:59:47 PM: Compiling @ngneat/until-destroy : main as umd
6:59:47 PM: Compiling @nguniversal/common : main as umd
6:59:47 PM: Compiling @nguniversal/common/clover : main as umd
6:59:48 PM: Compiling @nguniversal/express-engine/tokens : main as umd
6:59:48 PM: Compiling @nguniversal/express-engine : main as umd
6:59:48 PM: Compiling @nguniversal/common/engine : main as umd
6:59:48 PM: Compiling @scullyio/ng-lib : main as umd
6:59:51 PM: Done in 155.27s.
6:59:51 PM: NPM modules installed using Yarn
6:59:51 PM: Started restoring cached go cache
6:59:51 PM: Finished restoring cached go cache
6:59:51 PM: go version go1.14.4 linux/amd64
6:59:51 PM: go version go1.14.4 linux/amd64
6:59:51 PM: Installing missing commands
6:59:51 PM: Verify run directory
6:59:52 PM: ​
6:59:52 PM: ────────────────────────────────────────────────────────────────
6:59:52 PM:   Netlify Build                                                 
6:59:52 PM: ────────────────────────────────────────────────────────────────
6:59:52 PM: ​
6:59:52 PM: ❯ Version
6:59:52 PM:   @netlify/build 11.29.2
6:59:52 PM: ​
6:59:52 PM: ❯ Flags
6:59:52 PM:   deployId: 60b569a101c2a800074b83b0
6:59:52 PM: ​
6:59:52 PM: ❯ Current directory
6:59:52 PM:   /opt/build/repo
6:59:52 PM: ​
6:59:52 PM: ❯ Config file
6:59:52 PM:   /opt/build/repo/netlify.toml
6:59:52 PM: ​
6:59:52 PM: ❯ Context
6:59:52 PM:   deploy-preview
6:59:52 PM: ​
6:59:52 PM: ────────────────────────────────────────────────────────────────
6:59:52 PM:   1. build.command from netlify.toml                            
6:59:52 PM: ────────────────────────────────────────────────────────────────
6:59:52 PM: ​
6:59:52 PM: $ nx build web —prod && yarn run scully
6:59:52 PM: > nx run web:build
6:59:56 PM: - Generating browser application bundles...
7:00:01 PM: ———————————————————————————————————————————————
7:00:01 PM: >  NX   SUCCESS  Running target "build" succeeded
7:00:02 PM: yarn run v1.22.10
7:00:02 PM: $ npx scully --
7:00:03 PM: /opt/build/repo/dist/web/browser {
7:00:03 PM:   bareProject: false,
7:00:03 PM:   homeFolder: '/opt/build/repo',
7:00:03 PM:   outDir: '/opt/build/repo/dist/static',
7:00:03 PM:   inlineStateOnly: false,
7:00:03 PM:   thumbnails: false,
7:00:03 PM:   maxRenderThreads: 8,
7:00:03 PM:   handle404: '',
7:00:03 PM:   appPort: 1864,
7:00:03 PM:   staticPort: 1668,
7:00:03 PM:   reloadPort: 2667,
7:00:03 PM:   hostName: 'localhost',
7:00:03 PM:   defaultPostRenderers: [],
7:00:03 PM:   sourceRoot: 'apps/web/src',
7:00:03 PM:   projectRoot: './apps/web/src',
7:00:03 PM:   distFolder: './dist/web/browser',
7:00:03 PM:   projectName: 'web',
7:00:03 PM:   routes: { '/articles/:postId': { type: 'contentFolder', postId: [Object] } }
7:00:03 PM: }
7:00:03 PM: Angular distribution files not found, run "ng build" first
7:00:03 PM: error Command failed with exit code 15.
7:00:03 PM: info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
7:00:03 PM: ​
7:00:03 PM: ────────────────────────────────────────────────────────────────
7:00:03 PM:   "build.command" failed                                        
7:00:03 PM: ────────────────────────────────────────────────────────────────
7:00:03 PM: ​
7:00:03 PM:   Error message
7:00:03 PM:   Command failed with exit code 15: nx build web —prod && yarn run scully
7:00:03 PM: ​
7:00:03 PM:   Error location
7:00:03 PM:   In build.command from netlify.toml:
7:00:03 PM:   nx build web —prod && yarn run scully
7:00:03 PM: ​
7:00:03 PM:   Resolved config
7:00:03 PM:   build:
7:00:03 PM:     command: nx build web —prod && yarn run scully
7:00:03 PM:     commandOrigin: config
7:00:03 PM:     environment:
7:00:03 PM:       - REVIEW_ID
7:00:03 PM:     publish: /opt/build/repo/dist/static
7:00:03 PM:   functions:
7:00:03 PM:     '*': {}
7:00:03 PM:   redirects:
7:00:04 PM:     - from: /*      status: 200      to: /index.htmlCaching artifacts
7:00:04 PM: Started saving node modules
7:00:04 PM: Finished saving node modules
7:00:04 PM: Started saving build plugins
7:00:04 PM: Finished saving build plugins
7:00:04 PM: Started saving yarn cache
7:00:04 PM: Finished saving yarn cache
7:00:04 PM: Started saving pip cache
7:00:04 PM: Finished saving pip cache
7:00:04 PM: Started saving emacs cask dependencies
7:00:04 PM: Finished saving emacs cask dependencies
7:00:04 PM: Started saving maven dependencies
7:00:04 PM: Finished saving maven dependencies
7:00:04 PM: Started saving boot dependencies
7:00:04 PM: Finished saving boot dependencies
7:00:04 PM: Started saving rust rustup cache
7:00:04 PM: Finished saving rust rustup cache
7:00:04 PM: Started saving go dependencies
7:00:04 PM: Finished saving go dependencies
7:00:04 PM: Build failed due to a user error: Build script returned non-zero exit code: 2
7:00:04 PM: Creating deploy upload records
7:00:04 PM: Failing build: Failed to build site
7:00:04 PM: Failed during stage 'building site': Build script returned non-zero exit code: 2
7:00:04 PM: Finished processing build request in 3m29.449840791s

While the error seems like a Scully error, I’m posting here since I can only replicate it on Netlify.

The setup: I’ve tried multiple setups now but I’ll outline the latest:

Following a Netlify article I set up so Netlify’s build command was calling npx nx build web --prod && npx scully (Note: I am using NX so nx build web --prod is the same as ng build --prod).

I can remove my dist directory and see that all the files are recreated correctly when I run the Netlify build command locally.

  1. I have tried pointing the netlify.toml publish key to the Angular build and the Scully build.
  2. I have tried changing where the Angular build is output.
  3. I have looked at other netlify.toml files on GitHub and don’t notice anything different.

Any help here would be greatly appreciated as I’m sure I’m missing something simple. Thanks in advance!

scully.web.config.ts

import { ScullyConfig, setPluginConfig } from '@scullyio/scully';
import { timeToRead, timeToReadOptions } from 'scully-plugin-time-to-read';

setPluginConfig(‘md’, { enableSyntaxHighlighting: true });

setPluginConfig(timeToRead, {
path: ‘/articles’,
} as timeToReadOptions);

export const config: ScullyConfig = {
projectRoot: ‘./apps/web/src’,
projectName: ‘web’,
outDir: ‘./dist/static’,
distFolder: ‘./dist/web/browser’,
routes: {
‘/articles/:postId’: {
type: ‘contentFolder’,
postId: {
folder: ‘./articles’,
},
},
},
};

netlify.toml

[build]
  command = "nx build web —prod && yarn run scully"
  publish = "dist/static"
[[redirects]]
  from="/*"
  to="/index.html"
  status=200
package.json

{
  "name": "bc",
  "version": "6.0.0-alpha.1",
  "license": "MIT",
  "scripts": {
    "format": "nx format:write",
    "format:check": "nx format:check",
    "format:write": "nx format:write",
    "help": "nx help",
    "jam-it": "ng build && npm run scully --scanRoutes && npm run scully serve",
    "lint": "nx workspace-lint && ng lint",
    "ng": "nx",
    "nx": "nx",
    "postinstall": "node ./decorate-angular-cli.js && ngcc --properties es2015 browser module main",
    "scully": "npx scully --",
    "scully:prep-deploy": "npx nx build web --prod && yarn run log && npx scully --scanRoutes",
    "scully:serve": "npx scully serve --",
    "start": "ng serve",
    "test": "ng test",
    "update": "nx migrate latest",
    "log": "ls && ls dist && ls dist/web && ls dist/static",
    "workspace-generator": "nx workspace-generator"
  },
  "private": false,
  "dependencies": {
    "@angular/animations": "12.0.2",
    "@angular/common": "12.0.2",
    "@angular/compiler": "12.0.2",
    "@angular/core": "12.0.2",
    "@angular/forms": "12.0.2",
    "@angular/platform-browser": "12.0.2",
    "@angular/platform-browser-dynamic": "12.0.2",
    "@angular/platform-server": "12.0.2",
    "@angular/router": "12.0.2",
    "@ng-web-apis/common": "^1.9.0",
    "@ngneat/until-destroy": "^8.0.4",
    "@nguniversal/express-engine": "12.0.0",
    "@nrwl/angular": "12.3.4",
    "@scullyio/init": "^1.1.4",
    "@scullyio/ng-lib": "^1.0.0",
    "@scullyio/scully": "^1.0.0",
    "angular-animations": "^0.11.0",
    "express": "^4.15.2",
    "prismjs": "^1.23.0",
    "rxjs": "~6.6.3",
    "tslib": "^2.0.0",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "12.0.2",
    "@angular-eslint/eslint-plugin": "12.0.0",
    "@angular-eslint/eslint-plugin-template": "12.0.0",
    "@angular-eslint/template-parser": "12.0.0",
    "@angular/cli": "12.0.2",
    "@angular/compiler-cli": "12.0.2",
    "@angular/language-service": "12.0.2",
    "@nguniversal/builders": "12.0.0",
    "@nrwl/cli": "12.3.4",
    "@nrwl/cypress": "12.3.4",
    "@nrwl/eslint-plugin-nx": "12.3.4",
    "@nrwl/jest": "12.3.4",
    "@nrwl/linter": "12.3.4",
    "@nrwl/nx-cloud": "12.1.3",
    "@nrwl/tao": "12.3.4",
    "@nrwl/workspace": "12.3.4",
    "@types/express": "^4.17.0",
    "@types/jest": "^26.0.22",
    "@types/node": "^15.6.1",
    "@typescript-eslint/eslint-plugin": "^4.22.0",
    "@typescript-eslint/parser": "^4.22.0",
    "cypress": "^6.0.1",
    "dotenv": "^10.0.0",
    "eslint": "^7.25.0",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-cypress": "^2.10.3",
    "eslint-plugin-import": "^2.22.1",
    "jest": "27.0.1",
    "jest-preset-angular": "8.4.0",
    "netlify-schematics": "3.2.0",
    "prettier": "^2.3.0",
    "scully-plugin-time-to-read": "^0.0.4",
    "stylelint": "^13.13.0",
    "stylelint-config-standard": "^22.0.0",
    "ts-jest": "^27.0.1",
    "ts-node": "~9.1.1",
    "typescript": "4.2.4"
  }
}
angular.json

{
  "cli": {
    "defaultCollection": "@nrwl/angular"
  },
  "defaultProject": "web",
  "projects": {
    "web": {
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "configurations": {
            "production": {
              "budgets": [
                {
                  "maximumError": "3mb",
                  "maximumWarning": "1mb",
                  "type": "initial"
                },
                {
                  "maximumError": "10kb",
                  "maximumWarning": "6kb",
                  "type": "anyComponentStyle"
                }
              ],
              "buildOptimizer": true,
              "extractLicenses": true,
              "fileReplacements": [
                {
                  "replace": "apps/web/src/environments/environment.ts",
                  "with": "apps/web/src/environments/environment.prod.ts"
                }
              ],
              "namedChunks": false,
              "optimization": {
                "scripts": true,
                "styles": {
                  "minify": true,
                  "inlineCritical": true
                },
                "fonts": true
              },
              "outputHashing": "all",
              "sourceMap": false,
              "vendorChunk": false
            }
          },
          "options": {
            "assets": [
              "apps/web/src/favicon.ico",
              "apps/web/src/assets"
            ],
            "index": "apps/web/src/index.html",
            "main": "apps/web/src/main.ts",
            "outputPath": "dist/web/browser",
            "polyfills": "apps/web/src/polyfills.ts",
            "scripts": [],
            "styles": [
              "apps/web/src/styles.scss"
            ],
            "tsConfig": "apps/web/tsconfig.app.json",
            "vendorChunk": true,
            "extractLicenses": false,
            "buildOptimizer": false,
            "sourceMap": true,
            "optimization": false,
            "namedChunks": true
          }
        },
        "extract-i18n": {
          "builder": "@angular-devkit/build-angular:extract-i18n",
          "options": {
            "browserTarget": "web:build"
          }
        },
        "lint": {
          "builder": "@nrwl/linter:eslint",
          "options": {
            "lintFilePatterns": [
              "apps/web/src/**/*.ts",
              "apps/web/src/**/*.html"
            ]
          }
        },
        "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "configurations": {
            "production": {
              "browserTarget": "web:build:production"
            }
          },
          "options": {
            "browserTarget": "web:build"
          }
        },
        "test": {
          "builder": "@nrwl/jest:jest",
          "options": {
            "jestConfig": "apps/web/jest.config.js",
            "passWithNoTests": true
          },
          "outputs": [
            "coverage/apps/web"
          ]
        },
        "scully": {
          "builder": "@nrwl/workspace:run-commands",
          "options": {
            "commands": [
              "npm run scully --scanRoutes",
              "npm run scully serve"
            ],
            "parallel": false
          }
        }
      },
      "prefix": "bc",
      "projectType": "application",
      "root": "apps/web",
      "sourceRoot": "apps/web/src"
    },
    "web-e2e": {
      "architect": {
        "e2e": {
          "builder": "@nrwl/cypress:cypress",
          "configurations": {
            "production": {
              "devServerTarget": "web:serve:production"
            }
          },
          "options": {
            "cypressConfig": "apps/web-e2e/cypress.json",
            "devServerTarget": "web:serve",
            "tsConfig": "apps/web-e2e/tsconfig.e2e.json"
          }
        },
        "lint": {
          "builder": "@nrwl/linter:eslint",
          "options": {
            "lintFilePatterns": [
              "apps/web-e2e/**/*.{js,ts}"
            ]
          }
        }
      },
      "projectType": "application",
      "root": "apps/web-e2e",
      "sourceRoot": "apps/web-e2e/src"
    }
  },
  "schematics": {
    "@nrwl/angular": {
      "application": {
        "linter": "eslint"
      },
      "library": {
        "linter": "eslint"
      },
      "storybook-configuration": {
        "linter": "eslint"
      }
    },
    "@nrwl/angular:application": {
      "e2eTestRunner": "cypress",
      "linter": "eslint",
      "style": "scss",
      "unitTestRunner": "jest"
    },
    "@nrwl/angular:component": {
      "style": "scss"
    },
    "@nrwl/angular:library": {
      "linter": "eslint",
      "style": "scss",
      "unitTestRunner": "jest"
    }
  },
  "version": 1
}

Versions:

  Node : 12.22.1
  OS   : darwin x64
  yarn : 1.22.10

  @nrwl/angular : 12.3.4
  @nrwl/cli : 12.3.4
  @nrwl/cypress : 12.3.4
  @nrwl/devkit : 12.3.4
  @nrwl/eslint-plugin-nx : 12.3.4
  @nrwl/jest : 12.3.4
  @nrwl/linter : 12.3.4
  @nrwl/tao : 12.3.4
  @nrwl/workspace : 12.3.4
  typescript : 4.2.4

hi there,

thanks for writing a really great post! Personally, I have not encountered this bug before, so I am not quite sure what to suggest. That said, I am going to leave this open and see if someone else has ideas?

Thank you!

I’ve really enjoyed Netlify so far so I am hopeful :crossed_fingers:t3:

Only other path I have would be to start fresh and slowly move my existing app over piece by piece (its a small spa so not too bad). I would really just like to understand why it’s happening.

hey there, any progress on this? i know we haven’t really been that helpful, but i am going to guess that slowly rebuilding it is likely going to be the best approach.

No real news. Rebuilding didn’t seem to help. Between this and a few other issues I’ll probably be forced to move to Firebase. Feel free to close this.

So your initial build seems to have run fine - since you have:

>  NX   SUCCESS  Running target "build" succeeded

Then you run the Scully command.

However - Scully can’t find you “final” build files for whatever reason.

Try running this build without the Scully command at the end - and then try “find out” where and why Scully cant find your build output files

Hi Benjamin, I had the same problem. The script I ran was “ng build && npm run scully”. In my package.json the scully script is the default one “npx scully --”. I also tried a combination of angular and scully at once, named “jam”. The script was “ng build && npx scully – --scan”. The Angular build was always OK like in your case, but the Scully prerendering eventually failed. I solved the problem by chance, just trying things… I switched the “Build Image Selection” under “Site Setings > Build & deploy > Build image selection” to the last “legacy” OS “Ubuntu Xenial 16.04”. I’m not saying that is the best solution, but hey It worked! And now I can CI/CD with Scully scripts fine. I wish I had more technical knowledge on why it fails with the newest Build Image option. It seems to be related to Puppeteer and Chromium.

1 Like

Hey there, @isaacBejarano :wave:

Thanks for reaching out and sharing your interim solution with the Forums! It will definitely be beneficial to future members who encounter something similar.

I have looped in a member of the Support team to look into why switching the build image to Ubuntu Xenial 16.04 worked. We will follow up should we have more information on this! Thanks again :netlisparkles:

1 Like

Hi there, @isaacBejarano :wave:

Me again! We have been able to reproduce this case and have now opened up an issue internally to work on this with the appropriate stakeholders. While I cannot guarantee a timeline, I just wanted to share that your feedback made a difference. Thanks again!

Hi Hillary :wave: Thanks for your comment and potential feedback. Glad to help. I’m new here, and I feel really excited about Netlify. I hope to help when possible, and learn a lot in the process. :slightly_smiling_face:

1 Like

Hi @isaacBejarano , @benjamincharity :wave: Our developers rolled out a fix for this yesterday. Can you please try building on Focal again and let us know if you’re still running into issues?

1 Like

Hi @audrey audrey :wave:, I tested deploying on Ubuntu Focal and the building processes stopped with an error concerning Netlify UI’s plugin “Inline critical CSS, by Tom-Bonnike”. I unistalled that plugin and re-deployed. This time, all seemed to go OK, the app worked just fine, but I spoted an error in the Chrome’s and Firefox’s Console “Uncaught SyntaxError: Unexpected end of input” and “Uncaught SyntaxError: expected expression, got ‘}’” respectively. Both errors point to the deployed index.html. I copied that rendered index.html and inspected in VSC and I saw a typographic error on what it seems to be Scully prerendering Angular’s CSS links. The error is on the “onload” attr. of that stylesheet link. I tried deploying again, this time with the Algolia config commented in my local netlify.toml file, in case that was interfearing or something, but I got the same error. The App works fine… but there’s an error concerning stylesheets links prerendering. I attach a picture of that prerendered head.

Hey @audrey, :wave: thaks for the quick fix! I think the Build Img with Ubuntu Focal works just fine. I inspected my local build a little further and I got that same error when serving scully static pages locally (npx scully serve --). The weird thing is that I get no error when using Netlify CLI command “netlify dev”. So I guess I’m missing something, or that maybe Scully has a bug. Probably the first, hehehe. So, what I can tell is that the build with Ubuntu Focus just works, it deploys my app and it works. I’ll let you know if I figure ot where my console log error comes from, if it helps to someone. Thanks again for the fix! :slight_smile:

Thank you for confirming the fix worked @isaacBejarano ! :slightly_smiling_face: :pray:

Let me know if you need help with the SyntaxError issue.

2 Likes