Site name: modest-thompson-051914
I have recently started working on my next.js site again after about a year. As such, I have upgraded from next.js 11 to 12 (13 breaks the site, but I will eventually upgrade). After upgrading I Attempted to deploy the site. My site is connected to a GitHub repo and it deploys automatically as I push changes. After an initial failed deploy I had to upgrade the nextjs plugin for netlify.
Firstly, part of this plugin update has led to his enormous bit in the message logs:
3:40:55 AM: Patching /opt/build/repo/node_modules/next/dist/server/base-server.js
3:40:55 AM: Done
3:40:55 AM: Patching /opt/build/repo/node_modules/next/dist/server/next-server.js
3:40:55 AM: Done
3:40:55 AM: Moving static page files to serve from CDN...
3:40:55 AM: Moved 8 files
3:40:55 AM: You are not using Netlify Edge Functions for image format detection. Set env var "NEXT_FORCE_EDGE_IMAGES=true" to enable.
3:40:55 AM: Netlify configuration property "redirects" value changed to [
3:40:55 AM: { from: '/_next/static/*', to: '/static/:splat', status: 200 },
3:40:55 AM: {
3:40:55 AM: from: '/_next/image*',
3:40:55 AM: query: { url: ':url', w: ':width', q: ':quality' },
3:40:55 AM: to: '/_ipx/w_:width,q_:quality/:url',
3:40:55 AM: status: 301
3:40:55 AM: },
3:40:55 AM: { from: '/_ipx/*', to: '/.netlify/builders/_ipx', status: 200 },
3:40:55 AM: { from: '/cache/*', to: '/404.html', status: 404, force: true },
3:40:55 AM: { from: '/server/*', to: '/404.html', status: 404, force: true },
3:40:55 AM: { from: '/serverless/*', to: '/404.html', status: 404, force: true },
3:40:55 AM: { from: '/trace', to: '/404.html', status: 404, force: true },
3:40:55 AM: { from: '/traces', to: '/404.html', status: 404, force: true },
3:40:55 AM: {
3:40:55 AM: from: '/routes-manifest.json',
3:40:55 AM: to: '/404.html',
3:40:55 AM: status: 404,
3:40:55 AM: force: true
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/build-manifest.json',
3:40:55 AM: to: '/404.html',
3:40:55 AM: status: 404,
3:40:55 AM: force: true
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/prerender-manifest.json',
3:40:55 AM: to: '/404.html',
3:40:55 AM: status: 404,
3:40:55 AM: force: true
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/react-loadable-manifest.json',
3:40:55 AM: to: '/404.html',
3:40:55 AM: status: 404,
3:40:55 AM: force: true
3:40:55 AM: },
3:40:55 AM: { from: '/BUILD_ID', to: '/404.html', status: 404, force: true },
3:40:55 AM: {
3:40:55 AM: from: '/api/*',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/favicon.ico',
3:40:55 AM: to: '/favicon.ico',
3:40:55 AM: conditions: { Cookie: [Array] },
3:40:55 AM: status: 200
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/homepagecards.json',
3:40:55 AM: to: '/homepagecards.json',
3:40:55 AM: conditions: { Cookie: [Array] },
3:40:55 AM: status: 200
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/images/1-thumbnail.jpg',
3:40:55 AM: to: '/images/1-thumbnail.jpg',
3:40:55 AM: conditions: { Cookie: [Array] },
3:40:55 AM: status: 200
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/images/2-thumbnail.jpg',
3:40:55 AM: to: '/images/2-thumbnail.jpg',
3:40:55 AM: conditions: { Cookie: [Array] },
3:40:55 AM: status: 200
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/images/3-thumbnail.jpg',
3:40:55 AM: to: '/images/3-thumbnail.jpg',
3:40:55 AM: conditions: { Cookie: [Array] },
3:40:55 AM: status: 200
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/images/Homepage/homepage_slideshow_1.jpg',
3:40:55 AM: to: '/images/Homepage/homepage_slideshow_1.jpg',
3:40:55 AM: conditions: { Cookie: [Array] },
3:40:55 AM: status: 200
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/images/Homepage/homepage_slideshow_2.jpg',
3:40:55 AM: to: '/images/Homepage/homepage_slideshow_2.jpg',
3:40:55 AM: conditions: { Cookie: [Array] },
3:40:55 AM: status: 200
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/images/Homepage/homepage_slideshow_3.jpg',
3:40:55 AM: to: '/images/Homepage/homepage_slideshow_3.jpg',
3:40:55 AM: conditions: { Cookie: [Array] },
3:40:55 AM: status: 200
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/images/Homepage/homepage_slideshow_4.jpg',
3:40:55 AM: to: '/images/Homepage/homepage_slideshow_4.jpg',
3:40:55 AM: conditions: { Cookie: [Array] },
3:40:55 AM: status: 200
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/*',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: conditions: { Cookie: [Array] },
3:40:55 AM: force: true
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/_next/data/hiz8ubXU0k7f5Hbc9Q2qe/index.json',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/_next/data/hiz8ubXU0k7f5Hbc9Q2qe/user/forgotpassword.json',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/user/forgotpassword',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/_next/data/hiz8ubXU0k7f5Hbc9Q2qe/user/profile.json',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/user/profile',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/_next/data/hiz8ubXU0k7f5Hbc9Q2qe/user/resendconfirmationcode.json',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/user/resendconfirmationcode',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/_next/data/hiz8ubXU0k7f5Hbc9Q2qe/user/signin.json',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/user/signin',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/_next/data/hiz8ubXU0k7f5Hbc9Q2qe/user/signout.json',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/user/signout',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/_next/data/hiz8ubXU0k7f5Hbc9Q2qe/user/signup.json',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/user/signup',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/_next/data/hiz8ubXU0k7f5Hbc9Q2qe/vile.json',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/vile',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200,
3:40:55 AM: force: false
3:40:55 AM: },
3:40:55 AM: {
3:40:55 AM: from: '/*',
3:40:55 AM: to: '/.netlify/functions/___netlify-handler',
3:40:55 AM: status: 200
3:40:55 AM: }
3:40:55 AM: ].
3:40:55 AM:
3:40:55 AM: (@netlify/plugin-nextjs onBuild completed in 89ms)
The site does deploy successfully, but the images do not work and the fonts do not load. Everything works fine locally. The fonts are imported in css through Google Fonts and the images are stored in a “public” directory in the root of the project (as recommended by next.js). After a lot of tinkering and attempting to find solutions, nothing has worked. But I have figured out a few things:
- The images load fine on the default netlify domain, they do not on my custom domain. the custom domain is havenremix.com and is provided through Google Domains.
- Going through the console, I see the following messages:
I suspect this has to do with the redirects placed by the new plugin version. Reading through some other posts, it seems those are necessary. - Finally, what is perhaps the weirdest bit, most of the fonts load fine if I turn of adblock? This was not an issue with the old plugin, and I do not see why this is an issue now.
Any help and guidance is appreciated!
