Error when importing a custom font

[mont266]

Hi,
I have a website that is built using Gatsby. I am trying to use the ‘verveine’ font on the site.

I had originally got it working locally with the following code in the css:

@font-face {
  font-family: "verveine";
  src: url("../fonts/verveine/verveineregular.ttf");
  font-weight: bold;
  }

.PageHeader {
  background-color: var(--darkGrey);
  color: white;
  text-shadow: 1px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000, -1px 0 0 #000;
  padding: 15rem 0;
}

.PageHeader .BackgroundImage {
  opacity: 1;
}

.PageHeader-large {
  padding: 20rem 0;
}

.PageHeader--Title {
  font-family: verveine;
  font-size: 8.5rem;
  margin-bottom: 0;
}

.PageHeader--Subtitle {
  font-family: verveine;
  font-weight: 400;
  font-size: 2.8rem;
}

But I was getting a ‘module not found’ error whenever I tried to build on netlify (didn’t get this error locally and build succeeded)

After some research it seemed to be a case sensitive issue. So I changed the code to this:

@font-face {
  font-family: "verveine";
  src: url("../fonts/verveine/verveineregular.TTF");
  font-weight: bold;
  }

.PageHeader {
  background-color: var(--darkGrey);
  color: white;
  text-shadow: 1px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000, -1px 0 0 #000;
  padding: 15rem 0;
}

.PageHeader .BackgroundImage {
  opacity: 1;
}

.PageHeader-large {
  padding: 20rem 0;
}

.PageHeader--Title {
  font-family: verveine;
  font-size: 8.5rem;
  margin-bottom: 0;
}

.PageHeader--Subtitle {
  font-family: verveine;
  font-weight: 400;
  font-size: 2.8rem;
}

The file extension for the font is uppercase, so figured that was the issue. But I am now getting this error:

6:23:08 PM: Build ready to start
6:23:09 PM: build-image version: ac716c5be7f79fe384a0f3759e8ef612cb821a37 (xenial)
6:23:09 PM: build-image tag: v3.13.0
6:23:09 PM: buildbot version: 4aaa27647e859c2d38cfbb25901ceae1e7f3eeae
6:23:10 PM: Fetching cached dependencies
6:23:17 PM: Finished downloading cache in 7.192265826s
6:23:17 PM: Starting to extract cache
6:23:41 PM: Finished extracting cache in 23.763719756s
6:23:41 PM: Finished fetching cache in 31.141347032s
6:23:41 PM: Starting to prepare the repo for build
6:23:41 PM: Preparing Git Reference refs/heads/master
6:23:42 PM: Parsing package.json dependencies
6:23:43 PM: Starting build script
6:23:43 PM: Installing dependencies
6:23:43 PM: Python version set to 2.7
6:23:43 PM: Started restoring cached node version
6:23:47 PM: Finished restoring cached node version
6:23:47 PM: Attempting node version '14' from .nvmrc
6:23:48 PM: v14.19.3 is already installed.
6:23:48 PM: Now using node v14.19.3 (npm v6.14.17)
6:23:48 PM: Started restoring cached build plugins
6:23:48 PM: Finished restoring cached build plugins
6:23:49 PM: Attempting ruby version 2.7.1, read from environment
6:23:49 PM: Started restoring cached ruby version
6:23:49 PM: Finished restoring cached ruby version
6:23:51 PM: Using ruby version 2.7.1
6:23:51 PM: Using PHP version 5.6
6:23:51 PM: Started restoring cached yarn cache
6:24:03 PM: Finished restoring cached yarn cache
6:24:03 PM: No yarn workspaces detected
6:24:03 PM: Started restoring cached node modules
6:24:03 PM: Finished restoring cached node modules
6:24:04 PM: Installing NPM modules using Yarn version 1.3.2
6:24:04 PM: yarn install v1.3.2
6:24:04 PM: (node:1456) [DEP0005] DeprecationWarning: Buffer() is deprecated due to security and usability issues. Please use the Buffer.alloc(), Buffer.allocUnsafe(), or Buffer.from() methods instead.
6:24:04 PM: (Use `node --trace-deprecation ...` to show where the warning was created)
6:24:04 PM: [1/4] Resolving packages...
6:24:05 PM: warning gatsby > webpack-dev-server > chokidar > fsevents@1.2.13: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
6:24:05 PM: [2/4] Fetching packages...
6:24:17 PM: info fsevents@2.3.2: The platform "linux" is incompatible with this module.
6:24:17 PM: info "fsevents@2.3.2" is an optional dependency and failed compatibility check. Excluding it from installation.
6:24:17 PM: info fsevents@1.2.13: The platform "linux" is incompatible with this module.
6:24:17 PM: info "fsevents@1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
6:24:17 PM: [3/4] Linking dependencies...
6:24:17 PM: warning "gatsby > @pmmmwh/react-refresh-webpack-plugin@0.4.3" has unmet peer dependency "@types/webpack@4.x".
6:24:17 PM: warning "gatsby > @pmmmwh/react-refresh-webpack-plugin@0.4.3" has unmet peer dependency "sockjs-client@^1.4.0".
6:24:17 PM: warning "gatsby > @pmmmwh/react-refresh-webpack-plugin@0.4.3" has unmet peer dependency "type-fest@^0.13.1".
6:24:17 PM: warning "gatsby > @pmmmwh/react-refresh-webpack-plugin@0.4.3" has unmet peer dependency "webpack-plugin-serve@0.x || 1.x".
6:24:17 PM: warning "gatsby > react-hot-loader@4.13.0" has unmet peer dependency "@types/react@^15.0.0 || ^16.0.0 || ^17.0.0 ".
6:24:17 PM: warning "gatsby > @typescript-eslint/eslint-plugin > tsutils@3.20.0" has unmet peer dependency "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".
6:24:17 PM: warning "gatsby > gatsby-cli > node-fetch@2.6.7" has unmet peer dependency "encoding@^0.1.0".
6:24:17 PM: warning "gatsby > gatsby-telemetry > @turist/fetch@7.2.0" has unmet peer dependency "node-fetch@2".
6:24:17 PM: warning "gatsby > gatsby-cli > gatsby-recipes > ws@7.5.8" has unmet peer dependency "bufferutil@^4.0.1".
6:24:17 PM: warning "gatsby > gatsby-cli > gatsby-recipes > ws@7.5.8" has unmet peer dependency "utf-8-validate@^5.0.2".
6:24:17 PM: warning "gatsby > mini-css-extract-plugin > schema-utils > ajv-errors@1.0.1" has unmet peer dependency "ajv@>=5.0.0".
6:24:17 PM: warning "gatsby > socket.io > engine.io > ws@7.4.6" has unmet peer dependency "bufferutil@^4.0.1".
6:24:17 PM: warning "gatsby > socket.io > engine.io > ws@7.4.6" has unmet peer dependency "utf-8-validate@^5.0.2".
6:24:17 PM: warning "gatsby > eslint-plugin-graphql > graphql-config > @endemolshinegroup/cosmiconfig-typescript-loader > ts-node@9.1.1" has unmet peer dependency "typescript@>=2.7".
6:24:17 PM: warning "gatsby > eslint-plugin-graphql > graphql-config > @graphql-tools/url-loader > @n1ru4l/graphql-live-query@0.9.0" has incorrect peer dependency "graphql@^15.4.0 || ^16.0.0".
6:24:17 PM: warning "gatsby > eslint-plugin-graphql > graphql-config > @graphql-tools/url-loader > meros@1.2.0" has unmet peer dependency "@types/node@>=12".
6:24:17 PM: warning "gatsby > eslint-plugin-graphql > graphql-config > @graphql-tools/url-loader > ws@8.7.0" has unmet peer dependency "bufferutil@^4.0.1".
6:24:17 PM: warning "gatsby > eslint-plugin-graphql > graphql-config > @graphql-tools/url-loader > ws@8.7.0" has unmet peer dependency "utf-8-validate@^5.0.2".
6:24:17 PM: warning "gatsby > eslint-plugin-graphql > graphql-config > @graphql-tools/url-loader > @graphql-tools/delegate > graphql-executor@0.0.23" has incorrect peer dependency "graphql@^15.0.0 || ^16.0.0".
6:24:17 PM: warning "gatsby-plugin-netlify > webpack-assets-manifest@3.1.1" has unmet peer dependency "webpack@>=4.4.0".
6:24:17 PM: warning "gatsby-plugin-sass > sass-loader@7.3.1" has unmet peer dependency "webpack@^3.0.0 || ^4.0.0".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-azure@1.3.1" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-azure@1.3.1" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-bitbucket@2.14.0" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-bitbucket@2.14.0" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-git-gateway@2.13.1" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-git-gateway@2.13.1" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-github@2.14.1" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-github@2.14.1" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-gitlab@2.13.0" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-gitlab@2.13.0" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-proxy@1.2.3" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-test@2.11.3" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-test@2.11.3" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-backend-test@2.11.3" has unmet peer dependency "uuid@^3.3.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core@2.55.2" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core@2.55.2" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-lib-auth@2.4.2" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-lib-auth@2.4.2" has unmet peer dependency "uuid@^3.3.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-lib-util@2.15.1" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-lib-widgets@1.8.1" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-ui-default@2.15.5" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-ui-default@2.15.5" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-boolean@2.4.1" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-boolean@2.4.1" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-code@1.3.4" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-colorstring@1.1.2" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-date@2.6.3" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-file@2.12.1" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-file@2.12.1" has unmet peer dependency "uuid@^3.3.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-image@2.8.1" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-list@2.10.1" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-list@2.10.1" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-map@1.5.1" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-map@1.5.1" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-markdown@2.15.1" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-markdown@2.15.1" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-number@2.5.0" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-object@2.7.2" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-object@2.7.2" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-relation@2.11.1" has unmet peer dependency "lodash@^4.17.11".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-relation@2.11.1" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-relation@2.11.1" has unmet peer dependency "uuid@^3.3.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-select@2.8.2" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-string@2.3.0" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-text@2.4.1" has unmet peer dependency "prop-types@^15.7.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core > ajv-keywords@5.1.0" has incorrect peer dependency "ajv@^8.8.2".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core > react-dnd@14.0.5" has unmet peer dependency "@types/hoist-non-react-statics@>= 3.3.1".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core > react-dnd@14.0.5" has unmet peer dependency "@types/node@>= 12".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core > react-dnd@14.0.5" has unmet peer dependency "@types/react@>= 16".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core > react-frame-component@5.2.3" has unmet peer dependency "prop-types@^15.5.9".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core > react-markdown@6.0.3" has unmet peer dependency "@types/react@>=16".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core > react-sortable-hoc@2.0.0" has unmet peer dependency "prop-types@^15.5.7".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core > redux-devtools-extension@2.13.9" has unmet peer dependency "redux@^3.1.0 || ^4.0.0".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-ui-default > react-toggled@1.2.7" has unmet peer dependency "prop-types@>=15".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core > redux-notifications > react-redux@4.4.10" has unmet peer dependency "redux@^2.0.0 || ^3.0.0".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-code > react-select > @emotion/react@11.9.0" has unmet peer dependency "@babel/core@^7.0.0".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-core > react-router-dom > react-router > mini-create-react-context@0.4.1" has unmet peer dependency "prop-types@^15.0.0".
6:24:17 PM: warning "netlify-cms-app > netlify-cms-widget-code > react-select > @emotion/react > @emotion/babel-plugin@11.9.2" has unmet peer dependency "@babel/core@^7.0.0".
6:24:31 PM: [4/4] Building fresh packages...
6:25:15 PM: success Saved lockfile.
6:25:15 PM: Done in 70.84s.
6:25:15 PM: NPM modules installed using Yarn
6:25:15 PM: (node:8148) [DEP0005] DeprecationWarning: Buffer() is deprecated due to security and usability issues. Please use the Buffer.alloc(), Buffer.allocUnsafe(), or Buffer.from() methods instead.
6:25:15 PM: (Use `node --trace-deprecation ...` to show where the warning was created)
6:25:15 PM: Started restoring cached go cache
6:25:15 PM: Finished restoring cached go cache
6:25:15 PM: go version go1.14.4 linux/amd64
6:25:15 PM: go version go1.14.4 linux/amd64
6:25:15 PM: Installing missing commands
6:25:15 PM: Verify run directory
6:25:16 PM: ​
6:25:16 PM: ────────────────────────────────────────────────────────────────
6:25:16 PM:   Netlify Build                                                 
6:25:16 PM: ────────────────────────────────────────────────────────────────
6:25:16 PM: ​
6:25:16 PM: ❯ Version
6:25:16 PM:   @netlify/build 27.1.3
6:25:16 PM: ​
6:25:16 PM: ❯ Flags
6:25:16 PM:   baseRelDir: true
6:25:16 PM:   buildId: 629e37fcc5e7850008372d3a
6:25:16 PM:   deployId: 629e37fcc5e7850008372d3c
6:25:16 PM: ​
6:25:16 PM: ❯ Current directory
6:25:16 PM:   /opt/build/repo
6:25:16 PM: ​
6:25:16 PM: ❯ Config file
6:25:16 PM:   /opt/build/repo/netlify.toml
6:25:16 PM: ​
6:25:16 PM: ❯ Context
6:25:16 PM:   production
6:25:16 PM: ​
6:25:16 PM: ────────────────────────────────────────────────────────────────
6:25:16 PM:   1. build.command from netlify.toml                            
6:25:16 PM: ────────────────────────────────────────────────────────────────
6:25:16 PM: ​
6:25:16 PM: $ npm run build
6:25:16 PM: > yellowcake@2.0.0 build /opt/build/repo
6:25:16 PM: > gatsby build
6:25:19 PM: success open and validate gatsby-configs - 0.237s
6:25:20 PM: warning Warning: there are unknown plugin options for "gatsby-plugin-offline": runtimeCaching, skipWaiting, clientsClaim
6:25:20 PM: Please open an issue at ghub.io/gatsby-plugin-offline if you believe this option is valid.
6:25:20 PM: success load plugins - 1.081s
6:25:20 PM: success onPreInit - 0.114s
6:25:20 PM: success delete html and css files from previous builds - 0.004s
6:25:20 PM: success initialize cache - 0.004s
6:25:20 PM: success copy gatsby files - 0.026s
6:25:20 PM: success onPreBootstrap - 0.011s
6:25:20 PM: success createSchemaCustomization - 0.013s
6:25:21 PM: success Checking for changed pages - 0.000s
6:25:21 PM: success source and transform nodes - 0.305s
6:25:21 PM: success building schema - 0.468s
6:25:21 PM: Skipping
6:25:21 PM: Creating 2 infoPages
6:25:21 PM: Creating 4 pages
6:25:21 PM: Creating 6 postCategories
6:25:21 PM: Creating 49 posts
6:25:21 PM: info Total nodes: 248, SitePage nodes: 62 (use --verbose for breakdown)
6:25:21 PM: success createPages - 0.073s
6:25:21 PM: success Checking for changed pages - 0.000s
6:25:21 PM: success createPagesStatefully - 0.059s
6:25:21 PM: success update schema - 0.026s
6:25:21 PM: success onPreExtractQueries - 0.000s
6:25:22 PM: success extract queries from components - 0.527s
6:25:22 PM: warning The GraphQL query in the non-page component "/opt/build/repo/src/templates/HomePage.js" will not be run.
6:25:22 PM: Exported queries are only executed for Page components. It's possible you're
6:25:22 PM: trying to create pages in your gatsby-node.js and that's failing for some
reason.
6:25:22 PM: If the failing component(s) is a regular component and not intended to be a page
6:25:22 PM: component, you generally want to use a <StaticQuery> (https://gatsbyjs.org/docs/static-query)
6:25:22 PM: instead of exporting a page query.
6:25:22 PM: If you're more experienced with GraphQL, you can also export GraphQL
fragments from components and compose the fragments in the Page component
6:25:22 PM: query and pass data down into the child component — https://graphql.org/learn/queries/#fragments
6:25:22 PM: success write out redirect data - 0.001s
6:25:22 PM: success Build manifest and related icons - 0.132s
6:25:22 PM: success onPostBootstrap - 0.133s
6:25:22 PM: info bootstrap finished - 5.363s
6:25:22 PM: success run static queries - 0.027s - 2/2 74.06/s
6:25:22 PM: success run page queries - 0.488s - 63/63 129.07/s
6:25:22 PM: success write out requires - 0.003s
6:25:42 PM: error "gatsby-plugin-netlify-cms" threw an error while running the onCreateWebpackConfig lifecycle:
6:25:42 PM: Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
6:25:42 PM: ModuleParseError: Module parse failed: Unexpected character '' (1:0)
6:25:42 PM: You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
6:25:42 PM: (Source code omitted for this binary file)
6:25:42 PM:     at handleParseError (/opt/build/repo/node_modules/webpack/lib/NormalModule.js:469:19)
6:25:42 PM:     at /opt/build/repo/node_modules/webpack/lib/NormalModule.js:503:5
6:25:42 PM:     at /opt/build/repo/node_modules/webpack/lib/NormalModule.js:358:12
6:25:42 PM:     at /opt/build/repo/node_modules/loader-runner/lib/LoaderRunner.js:373:3
6:25:42 PM:     at iterateNormalLoaders (/opt/build/repo/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
6:25:42 PM:     at Array.<anonymous> (/opt/build/repo/node_modules/loader-runner/lib/LoaderRunner.js:205:4)
6:25:42 PM:     at Storage.finished (/opt/build/repo/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)
6:25:42 PM:     at /opt/build/repo/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9
6:25:42 PM:     at /opt/build/repo/node_modules/graceful-fs/graceful-fs.js:123:16
6:25:42 PM:     at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:71:3)
6:25:42 PM: 
6:25:42 PM: 
6:25:42 PM:   ModuleBuildError: Module build failed (from ./node_modules/mini-css-extract-pl  ugin/dist/loader.js):
6:25:42 PM:   ModuleParseError: Module parse failed: Unexpected character '' (1:0)
6:25:42 PM:   You may need an appropriate loader to handle this file type, currently no load  ers are configured to process this file. See https://webpack.js.org/concepts#l  oaders
6:25:42 PM:   (Source code omitted for this binary file)
6:25:42 PM:   
6:25:42 PM:   - NormalModule.js:469 handleParseError
6:25:42 PM:     [repo]/[webpack]/lib/NormalModule.js:469:19
6:25:42 PM:   
6:25:42 PM:   - NormalModule.js:503 
6:25:42 PM:     [repo]/[webpack]/lib/NormalModule.js:503:5
6:25:42 PM:   
6:25:42 PM:   - NormalModule.js:358 
6:25:42 PM:     [repo]/[webpack]/lib/NormalModule.js:358:12
6:25:42 PM:   
6:25:42 PM:   - LoaderRunner.js:373 
6:25:42 PM:     [repo]/[loader-runner]/lib/LoaderRunner.js:373:3
6:25:42 PM:   
6:25:42 PM:   - LoaderRunner.js:214 iterateNormalLoaders
6:25:42 PM:     [repo]/[loader-runner]/lib/LoaderRunner.js:214:10
6:25:42 PM:   
6:25:42 PM:   - LoaderRunner.js:205 Array.<anonymous>
6:25:42 PM:     [repo]/[loader-runner]/lib/LoaderRunner.js:205:4
6:25:42 PM:   
6:25:42 PM:   - CachedInputFileSystem.js:55 Storage.finished
6:25:42 PM:     [repo]/[enhanced-resolve]/lib/CachedInputFileSystem.js:55:16
6:25:42 PM:   
6:25:42 PM:   - CachedInputFileSystem.js:91 
6:25:42 PM:     [repo]/[enhanced-resolve]/lib/CachedInputFileSystem.js:91:9
6:25:42 PM:   
6:25:42 PM:   - graceful-fs.js:123 
6:25:42 PM:     [repo]/[graceful-fs]/graceful-fs.js:123:16
6:25:42 PM:   
6:25:42 PM:   - read_file_context.js:71 FSReqCallback.readFileAfterClose [as oncomplete]
6:25:42 PM:     internal/fs/read_file_context.js:71:3
6:25:42 PM:   
6:25:42 PM:   - NormalModule.js:316 
6:25:42 PM:     [repo]/[webpack]/lib/NormalModule.js:316:20
6:25:42 PM:   
6:25:42 PM:   - LoaderRunner.js:367 
6:25:42 PM:     [repo]/[loader-runner]/lib/LoaderRunner.js:367:11
6:25:42 PM:   
6:25:42 PM:   - LoaderRunner.js:182 
6:25:42 PM:     [repo]/[loader-runner]/lib/LoaderRunner.js:182:20
6:25:42 PM:   
6:25:42 PM:   - LoaderRunner.js:111 context.callback
6:25:42 PM:     [repo]/[loader-runner]/lib/LoaderRunner.js:111:13
6:25:42 PM:   
6:25:42 PM:   - loader.js:148 
6:25:42 PM:     [repo]/[mini-css-extract-plugin]/dist/loader.js:148:14
6:25:42 PM:   
6:25:42 PM:   - Compiler.js:343 
6:25:42 PM:     [repo]/[webpack]/lib/Compiler.js:343:11
6:25:42 PM:   
6:25:42 PM:   - Compiler.js:681 
6:25:42 PM:     [repo]/[webpack]/lib/Compiler.js:681:15
6:25:42 PM:   
6:25:42 PM:   
6:25:42 PM:   - Hook.js:154 AsyncSeriesHook.lazyCompileHook
6:25:42 PM:     [repo]/[tapable]/lib/Hook.js:154:20
6:25:42 PM:   
6:25:42 PM:   - Compiler.js:678 
6:25:42 PM:     [repo]/[webpack]/lib/Compiler.js:678:31
6:25:42 PM:   
6:25:42 PM:   
6:25:42 PM:   - Hook.js:154 AsyncSeriesHook.lazyCompileHook
6:25:42 PM:     [repo]/[tapable]/lib/Hook.js:154:20
6:25:42 PM:   
6:25:42 PM:   - Compilation.js:1423 
6:25:42 PM:     [repo]/[webpack]/lib/Compilation.js:1423:35
6:25:42 PM:   
6:25:42 PM:   
6:25:42 PM:   - Hook.js:154 AsyncSeriesHook.lazyCompileHook
6:25:42 PM:     [repo]/[tapable]/lib/Hook.js:154:20
6:25:42 PM:   
6:25:42 PM:   - Compilation.js:1414 
6:25:42 PM:     [repo]/[webpack]/lib/Compilation.js:1414:32
6:25:42 PM:   
6:25:42 PM: 
6:25:42 PM: not finished Building production JavaScript and CSS bundles - 19.682s
6:25:42 PM: npm ERR! code ELIFECYCLE
6:25:42 PM: npm ERR! errno 1
6:25:42 PM: npm ERR! yellowcake@2.0.0 build: `gatsby build`
6:25:42 PM: npm ERR! Exit status 1
6:25:42 PM: npm ERR!
6:25:42 PM: npm ERR! Failed at the yellowcake@2.0.0 build script.
6:25:42 PM: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
6:25:42 PM: npm ERR! A complete log of this run can be found in:
6:25:42 PM: npm ERR!     /opt/buildhome/.npm/_logs/2022-06-06T17_25_42_655Z-debug.log
6:25:42 PM: ​
6:25:42 PM: ────────────────────────────────────────────────────────────────
6:25:42 PM:   "build.command" failed                                        
6:25:42 PM: ────────────────────────────────────────────────────────────────
6:25:42 PM: ​
6:25:42 PM:   Error message
6:25:42 PM:   Command failed with exit code 1: npm run build (https://ntl.fyi/exit-code-1)
6:25:42 PM: ​
6:25:42 PM:   Error location
6:25:42 PM:   In build.command from netlify.toml:
6:25:42 PM:   npm run build
6:25:42 PM: ​
6:25:42 PM:   Resolved config
6:25:42 PM:   build:
6:25:42 PM:     command: npm run build
6:25:42 PM:     commandOrigin: config
6:25:42 PM:     environment:
6:25:42 PM:       - YARN_VERSION
6:25:42 PM:       - YARN_FLAGS
6:25:42 PM:     publish: /opt/build/repo/public
6:25:42 PM:     publishOrigin: config
6:25:43 PM: Caching artifacts
6:25:43 PM: Started saving node modules
6:25:43 PM: Finished saving node modules
6:25:43 PM: Started saving build plugins
6:25:43 PM: Finished saving build plugins
6:25:43 PM: Started saving yarn cache
6:25:55 PM: Finished saving yarn cache
6:25:55 PM: Started saving pip cache
6:25:55 PM: Finished saving pip cache
6:25:55 PM: Started saving emacs cask dependencies
6:25:55 PM: Finished saving emacs cask dependencies
6:25:55 PM: Started saving maven dependencies
6:25:55 PM: Finished saving maven dependencies
6:25:55 PM: Started saving boot dependencies
6:25:55 PM: Creating deploy upload records
6:25:55 PM: Finished saving boot dependencies
6:25:55 PM: Started saving rust rustup cache
6:25:55 PM: Finished saving rust rustup cache
6:25:55 PM: Started saving go dependencies
6:25:55 PM: Finished saving go dependencies
6:25:55 PM: Build failed due to a user error: Build script returned non-zero exit code: 2
6:25:56 PM: Failed during stage 'building site': Build script returned non-zero exit code: 2 (https://ntl.fyi/exit-code-2)
6:25:55 PM: Failing build: Failed to build site
6:25:56 PM: Finished processing build request in 2m46.236851808s

Any help or guidance here would be greatly appreciated!

TIA

[perry]

hi there,

i’m going to guess that this is a paths issue:

 src: url("../fonts/verveine/verveineregular.ttf");

this might work locally but i am going to bet using a relative path and going up a directory before you go into fonts is the problem.

if i were troubleshooting this for myself, i would download the site we are building and deploying:

Can I download my website?

Hello! thanks for reading, I would like to solve this issue. So recently my computer has oxygenated, therefore i lost my computer- now I have a new one. I cant access my hard drive yet, and I have alot of projects there especially my netlify ones. I would like to download my own website which i have access to in my account, but I do not know how, it is already deployed. is there a way I can download a deployed build? i would really love to get my website back. I would be super glad if i get it…

and then you can check to see if the paths are actually the ones you need them to be.

it still could be an issue of case sensitivity - do keep in mind that just changing the name of the file isn’t enough once it has been tracked by git, see our advice here:

[Support Guide] Netlify app builds locally but fails on deploy (case sensitivity)

Last Reviewed By Netlify Support Staff: December 2022 Are you struggling to understand why your project runs locally but errors out with missing files or logs that point toward issues with case when you try and build on Netlify? You are not alone. Often, case (as in: UPPERCASE or lowercase letters in filenames or paths) can cause problems. Here is a guide to understanding how case sensitivity issues present themselves, why they arise, and how you can fix them! 1. Errors you might see Case sens…

let us know if you still have problems after ruling these things out.

[mont266]

Hi,

Thanks for all that information, was really good to read and understand how it all works some more.

I did manage to get it to work but it was strange.

I actually just converted the .ttf font file into .woff2 and it built fine on netlify and locally.

Maybe an issue with webpack not supporting .ttf files? Not sure, but thought I would share my solution incase anyone else runs into the same problem in the future.

Thanks

[bennnnnnn]

I ran into this issue too (custom font not loading), within the context of deploying a hydrogen app (based on the sample hydrogen storefront app).

Not sure what the issue is so far, but it works fine on vercel. Feels like the team has some work to do here.