Skip to content

[Bug]: trailingSlash: true working locally but not on Netlify #1788

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
2 tasks
Tracked by #1638
thomasryu opened this issue Nov 18, 2022 · 6 comments
Closed
2 tasks
Tracked by #1638

[Bug]: trailingSlash: true working locally but not on Netlify #1788

thomasryu opened this issue Nov 18, 2022 · 6 comments
Labels
type: bug code to address defects in shipped code

Comments

@thomasryu
Copy link

thomasryu commented Nov 18, 2022

Summary

I am using a combination of TypeScript and NextJs and the trailingSlash: true option is not working on Netlify, with neither Pretty URLs enabled or not.

I've looked at the other related issues, currently opened, solved or closed, but none of the listed solutions work.

A simple example can be found here

Steps to reproduce

  1. Go to https://spiffy-sundae-34f3ed.netlify.app/
  2. Click on the link.
  3. Notice the destination doesn't have the trailing slash.

A link to a reproduction repository

https://github.com/thomasryu/nextjs-test

Next Runtime version

4.29.1

More information about your build

  • I am building using the CLI
  • I am building using file-based configuration (netlify.toml)

What OS are you using?

No response

Your netlify.toml file

`netlify.toml`
[build.environment]
  NODE_VERSION = "12.22.7"

# Cache rules for fonts

[[headers]]
  for = "*.ttf"
  [headers.values]
    Cache-Control = "public, max-age=31536000, immutable"

[[headers]]
  for = "*.woff"
  [headers.values]
    Cache-Control = "public, max-age=31536000, immutable"

[[headers]]
  for = "*.woff2"
  [headers.values]
    Cache-Control = "public, max-age=31536000, immutable"

Your public/_redirects file

`_redirects`
# Paste content of your `_redirects` file here

Your next.config.js file

`next.config.js`
module.exports = {
  trailingSlash: true,
}

Builds logs (or link to your logs)

Build logs
3:10:14 PM: build-image version: d55944c047ef0aee2ac01971edde72cb2a50acfe (focal)
3:10:14 PM: build-image tag: v4.16.1
3:10:14 PM: buildbot version: abbb532f43aba2e093b26ceac3d8b53e7097bae8
3:10:14 PM: Fetching cached dependencies
3:10:14 PM: Starting to download cache of 574.3MB
3:10:19 PM: Finished downloading cache in 4.38786498s
3:10:19 PM: Starting to extract cache
3:10:22 PM: Finished extracting cache in 3.127894048s
3:10:22 PM: Finished fetching cache in 7.595130608s
3:10:22 PM: Starting to prepare the repo for build
3:10:22 PM: Preparing Git Reference refs/heads/master
3:10:22 PM: Parsing package.json dependencies
3:10:23 PM: Section completed: initializing
3:10:24 PM: Starting build script
3:10:24 PM: Installing dependencies
3:10:24 PM: Python version set to 2.7
3:10:24 PM: Started restoring cached node version
3:10:25 PM: Finished restoring cached node version
3:10:25 PM: v12.22.7 is already installed.
3:10:25 PM: Now using node v12.22.7 (npm v6.14.15)
3:10:25 PM: Started restoring cached build plugins
3:10:25 PM: Finished restoring cached build plugins
3:10:25 PM: Attempting ruby version 2.7.2, read from environment
3:10:26 PM: Using ruby version 2.7.2
3:10:26 PM: Using PHP version 8.0
3:10:26 PM: Started restoring cached yarn cache
3:10:27 PM: Finished restoring cached yarn cache
3:10:28 PM: No yarn workspaces detected
3:10:28 PM: Started restoring cached node modules
3:10:28 PM: Finished restoring cached node modules
3:10:28 PM: Installing NPM modules using Yarn version 1.22.19
3:10:28 PM: yarn install v1.22.19
3:10:28 PM: [1/4] Resolving packages...
3:10:28 PM: [2/4] Fetching packages...
3:10:28 PM: [3/4] Linking dependencies...
3:10:29 PM: [4/4] Building fresh packages...
3:10:29 PM: Done in 1.30s.
3:10:29 PM: NPM modules installed using Yarn
3:10:29 PM: Started restoring cached go cache
3:10:29 PM: Finished restoring cached go cache
3:10:29 PM: Installing Go version 1.17 (requested 1.17)
3:10:35 PM: unset GOOS;
3:10:35 PM: unset GOARCH;
3:10:35 PM: export GOROOT='/opt/buildhome/.gimme/versions/go1.17.linux.amd64';
3:10:35 PM: export PATH="/opt/buildhome/.gimme/versions/go1.17.linux.amd64/bin:${PATH}";
3:10:35 PM: go version >&2;
3:10:35 PM: export GIMME_ENV="/opt/buildhome/.gimme/env/go1.17.linux.amd64.env"
3:10:35 PM: go version go1.17 linux/amd64
3:10:35 PM: Detected 1 framework(s)
3:10:35 PM: "next" at version "12.2.5"
3:10:35 PM: Installing missing commands
3:10:35 PM: Verify run directory
3:10:37 PM: ​
3:10:37 PM:   Netlify Build                                                 
3:10:37 PM: ────────────────────────────────────────────────────────────────
3:10:37 PM: ​
3:10:37 PM: ❯ Version
3:10:37 PM:   @netlify/build 29.1.3
3:10:37 PM: ​
3:10:37 PM: ❯ Flags
3:10:37 PM:   baseRelDir: true
3:10:37 PM:   buildId: 63a1fa7cf612fa0009bb5054
3:10:37 PM:   deployId: 63a1fa7cf612fa0009bb5056
3:10:37 PM: ​
3:10:37 PM: ❯ Current directory
3:10:37 PM:   /opt/build/repo
3:10:37 PM: ​
3:10:37 PM: ❯ Config file
3:10:37 PM:   /opt/build/repo/netlify.toml
3:10:37 PM: ​
3:10:37 PM: ❯ Context
3:10:37 PM:   production
3:10:37 PM: ​
3:10:37 PM: ❯ Using Next.js Runtime - v4.29.3
3:10:38 PM: ​
3:10:38 PM:   1. @netlify/plugin-nextjs (onPreBuild event)                  
3:10:38 PM: ────────────────────────────────────────────────────────────────
3:10:38 PM: ​
3:10:38 PM: Next.js cache restored.
3:10:38 PM: Netlify configuration property "build.environment.NEXT_PRIVATE_TARGET" value changed.
3:10:38 PM: ​
3:10:38 PM: (@netlify/plugin-nextjs onPreBuild completed in 54ms)
3:10:38 PM: ​
3:10:38 PM:   2. Build command from Netlify app                             
3:10:38 PM: ────────────────────────────────────────────────────────────────
3:10:38 PM: ​
3:10:38 PM: $ yarn build
3:10:38 PM: yarn run v1.22.19
3:10:38 PM: $ next build
3:10:39 PM: info  - Linting and checking validity of types...
3:10:41 PM: info  - Creating an optimized production build...
3:10:45 PM: info  - Compiled successfully
3:10:45 PM: info  - Collecting page data...
3:10:47 PM: info  - Generating static pages (0/4)
3:10:47 PM: info  - Generating static pages (1/4)
3:10:47 PM: info  - Generating static pages (2/4)
3:10:47 PM: info  - Generating static pages (3/4)
3:10:47 PM: info  - Generating static pages (4/4)
3:10:48 PM: info  - Finalizing page optimization...
3:10:48 PM: Route (pages)                              Size     First Load JS
3:10:48 PM: ┌ ○ /                                      325 B          74.4 kB
3:10:48 PM: ├   /_app                                  0 B            74.1 kB
3:10:48 PM: ├ ○ /404                                   194 B          74.3 kB
3:10:48 PM: └ ○ /about                                 263 B          74.3 kB
3:10:48 PM: + First Load JS shared by all              74.7 kB
3:10:48 PM:   ├ chunks/framework-5f4595e5518b5600.js   42 kB
3:10:48 PM:   ├ chunks/main-7dfaec87f45da641.js        30.8 kB
3:10:48 PM:   ├ chunks/pages/_app-b471eee8ccbf78ab.js  528 B
3:10:48 PM:   ├ chunks/webpack-fd82975a6094609f.js     727 B
3:10:48 PM:   └ css/b52e0d32efda9b9a.css               584 B
3:10:48 PM: ○  (Static)  automatically rendered as static HTML (uses no initial props)
3:10:48 PM: Done in 9.63s.
3:10:48 PM: ​
3:10:48 PM: (build.command completed in 9.7s)
3:10:48 PM: ​
3:10:48 PM:   3. @netlify/plugin-nextjs (onBuild event)                     
3:10:48 PM: ────────────────────────────────────────────────────────────────
3:10:48 PM: ​
3:10:48 PM: { functionsDir: '/opt/build/repo/.netlify/functions-internal' }
3:10:48 PM: Patching /opt/build/repo/node_modules/next/dist/server/base-server.js
3:10:48 PM: Done
3:10:48 PM: Patching /opt/build/repo/node_modules/next/dist/server/next-server.js
3:10:48 PM: Done
3:10:48 PM: Moving static page files to serve from CDN...
3:10:48 PM: Moved 2 files
3:10:48 PM: Using Netlify Edge Functions for image format detection. Set env var "NEXT_DISABLE_EDGE_IMAGES=true" to disable.
3:10:48 PM: Netlify configuration property "redirects" value changed to [
3:10:48 PM:   { from: '/_next/static/*', to: '/static/:splat', status: 200 },
3:10:48 PM:   {
3:10:48 PM:     from: '/_next/image/*',
3:10:48 PM:     query: { url: ':url', w: ':width', q: ':quality' },
3:10:48 PM:     to: '/_ipx/w_:width,q_:quality/:url',
3:10:48 PM:     status: 301
3:10:48 PM:   },
3:10:48 PM:   { from: '/_ipx/*', to: '/.netlify/builders/_ipx', status: 200 },
3:10:48 PM:   { from: '/cache/*', to: '/404.html', status: 404, force: true },
3:10:48 PM:   { from: '/server/*', to: '/404.html', status: 404, force: true },
3:10:48 PM:   { from: '/serverless/*', to: '/404.html', status: 404, force: true },
3:10:48 PM:   { from: '/trace', to: '/404.html', status: 404, force: true },
3:10:48 PM:   { from: '/traces', to: '/404.html', status: 404, force: true },
3:10:48 PM:   {
3:10:48 PM:     from: '/routes-manifest.json',
3:10:48 PM:     to: '/404.html',
3:10:48 PM:     status: 404,
3:10:48 PM:     force: true
3:10:48 PM:   },
3:10:48 PM:   {
3:10:48 PM:     from: '/build-manifest.json',
3:10:48 PM:     to: '/404.html',
3:10:48 PM:     status: 404,
3:10:48 PM:     force: true
3:10:48 PM:   },
3:10:48 PM:   {
3:10:48 PM:     from: '/prerender-manifest.json',
3:10:48 PM:     to: '/404.html',
3:10:48 PM:     status: 404,
3:10:48 PM:     force: true
3:10:48 PM:   },
3:10:48 PM:   {
3:10:48 PM:     from: '/react-loadable-manifest.json',
3:10:48 PM:     to: '/404.html',
3:10:48 PM:     status: 404,
3:10:48 PM:     force: true
3:10:48 PM:   },
3:10:48 PM:   { from: '/BUILD_ID', to: '/404.html', status: 404, force: true },
3:10:48 PM:   {
3:10:48 PM:     from: '/api/*',
3:10:48 PM:     to: '/.netlify/functions/___netlify-handler',
3:10:48 PM:     status: 200
3:10:48 PM:   },
3:10:48 PM:   {
3:10:48 PM:     from: '/*',
3:10:48 PM:     to: '/.netlify/functions/___netlify-handler',
3:10:48 PM:     status: 200,
3:10:48 PM:     conditions: { Cookie: [Array] },
3:10:48 PM:     force: true
3:10:48 PM:   },
3:10:48 PM:   {
3:10:48 PM:     from: '/_next/data/CRpiNgunAUTscf_-6X6qP/index.json',
3:10:48 PM:     to: '/.netlify/functions/___netlify-handler',
3:10:48 PM:     status: 200,
3:10:48 PM:     force: false
3:10:48 PM:   },
3:10:48 PM:   {
3:10:48 PM:     from: '/',
3:10:48 PM:     to: '/.netlify/functions/___netlify-handler',
3:10:48 PM:     status: 200,
3:10:48 PM:     force: false
3:10:48 PM:   },
3:10:48 PM:   {
3:10:48 PM:     from: '/_next/data/CRpiNgunAUTscf_-6X6qP/about.json',
3:10:48 PM:     to: '/.netlify/functions/___netlify-handler',
3:10:48 PM:     status: 200,
3:10:48 PM:     force: false
3:10:48 PM:   },
3:10:48 PM:   {
3:10:48 PM:     from: '/about',
3:10:48 PM:     to: '/.netlify/functions/___netlify-handler',
3:10:48 PM:     status: 200,
3:10:48 PM:     force: false
3:10:48 PM:   },
3:10:48 PM:   {
3:10:48 PM:     from: '/*',
3:10:48 PM:     to: '/.netlify/functions/___netlify-handler',
3:10:48 PM:     status: 200
3:10:48 PM:   }
3:10:48 PM: ].
3:10:48 PM: ​
3:10:48 PM: (@netlify/plugin-nextjs onBuild completed in 40ms)
3:10:48 PM: ​
3:10:48 PM:   4. Functions bundling                                         
3:10:48 PM: ────────────────────────────────────────────────────────────────
3:10:48 PM: ​
3:10:48 PM: Packaging Functions from .netlify/functions-internal directory:
3:10:48 PM:  - ___netlify-handler/___netlify-handler.js
3:10:48 PM:  - ___netlify-odb-handler/___netlify-odb-handler.js
3:10:48 PM:  - _ipx/_ipx.js
3:10:48 PM: ​
3:10:55 PM: ​
3:10:55 PM: (Functions bundling completed in 7.4s)
3:10:55 PM: ​
3:10:55 PM:   5. Edge Functions bundling                                    
3:10:55 PM: ────────────────────────────────────────────────────────────────
3:10:55 PM: ​
3:10:55 PM: Packaging Edge Functions from .netlify/edge-functions directory:
3:10:55 PM:  - ipx
3:10:56 PM: ​
3:10:56 PM: (Edge Functions bundling completed in 869ms)
3:10:56 PM: ​
3:10:56 PM:   6. @netlify/plugin-nextjs (onPostBuild event)                 
3:10:56 PM: ────────────────────────────────────────────────────────────────
3:10:56 PM: ​
3:10:56 PM: Next.js cache saved.
3:10:56 PM: ​
3:10:56 PM: (@netlify/plugin-nextjs onPostBuild completed in 33ms)
3:10:56 PM: ​
3:10:56 PM:   7. Deploy site                                                
3:10:56 PM: ────────────────────────────────────────────────────────────────
3:10:56 PM: ​
3:10:56 PM: Starting to deploy site from '.next'
3:10:56 PM: Creating deploy tree 
3:10:56 PM: 15 new files to upload
3:10:56 PM: 3 new functions to upload
3:11:04 PM: Section completed: deploying
3:11:04 PM: Site deploy was successfully initiated
3:11:04 PM: ​
3:11:04 PM: (Deploy site completed in 7.7s)
3:11:04 PM: ​
3:11:04 PM:   Netlify Build Complete                                        
3:11:04 PM: Starting post processing
3:11:04 PM: ────────────────────────────────────────────────────────────────
3:11:04 PM: ​
3:11:04 PM: (Netlify Build completed in 27.3s)
3:11:04 PM: Post processing - HTML
3:11:04 PM: Caching artifacts
3:11:04 PM: Started saving node modules
3:11:04 PM: Finished saving node modules
3:11:04 PM: Started saving build plugins
3:11:04 PM: Finished saving build plugins
3:11:04 PM: Started saving yarn cache
3:11:04 PM: Post processing - header rules
3:11:05 PM: Post processing - redirect rules
3:11:05 PM: Post processing done
3:11:05 PM: Section completed: postprocessing
3:11:06 PM: Finished saving yarn cache
3:11:06 PM: Started saving pip cache
3:11:06 PM: Finished saving pip cache
3:11:06 PM: Started saving emacs cask dependencies
3:11:06 PM: Finished saving emacs cask dependencies
3:11:06 PM: Started saving maven dependencies
3:11:06 PM: Finished saving maven dependencies
3:11:06 PM: Started saving boot dependencies
3:11:06 PM: Finished saving boot dependencies
3:11:06 PM: Started saving rust rustup cache
3:11:06 PM: Finished saving rust rustup cache
3:11:06 PM: Started saving go dependencies
3:11:06 PM: Finished saving go dependencies
3:11:06 PM: Build script success
3:11:06 PM: Section completed: building
3:11:08 PM: Uploading Cache of size 566.7MB
3:11:09 PM: Site is live ✨
3:11:12 PM: Section completed: cleanup
3:11:12 PM: Finished processing build request in 58.303999101s

Function logs

Function logs
# Paste logs here

.next JSON files

generated .next JSON files
# Paste file contents here. Please check there isn't any private info in them
# You can either build locally, or download the deploy from Netlify by clicking the arrow next to the deploy time.
@thomasryu thomasryu added the type: bug code to address defects in shipped code label Nov 18, 2022
@ascorbic ascorbic mentioned this issue Nov 24, 2022
6 tasks
@thomasryu
Copy link
Author

Any update on this?

@nickytonline
Copy link

Hi @thomasryu. This should be working. We have tests for it. Here's the config for one of our test sites with it enabled. https://github.com/netlify/next-runtime/blob/main/demos/default/next.config.js#L42

If you've installed the Netlify Next runtime explicitly in your pacakge.json, upgrade to the latest. Otherwise, if you deploy it should pick up the latest Netlify Next runtime.

@thomasryu
Copy link
Author

thomasryu commented Dec 20, 2022

Hey @nickytonline, I really don't know what to say, I've further trimmed my linked GitHub project down to see if I can pinpoint the problem, but it just doesn't seem work.

Right now, my config file is literally just the trailingSlash: true option.

And after the cleanup, Netlify is even going on the opposite direction and stripping the trailing slash away (e.g.: https://spiffy-sundae-34f3ed.netlify.app/about/).

For reference, I've ran built this same barebones project locally and uploaded it to Vercel and both works as intended :/

@PFJoey
Copy link

PFJoey commented Jan 9, 2023

We are also experiencing the same issue as @thomasryu.

@hk86
Copy link

hk86 commented Feb 6, 2023

Same issue for me. Was anyone able to solve it?

@sarahetter
Copy link

Closing as duplicate #998

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
type: bug code to address defects in shipped code
Projects
None yet
Development

No branches or pull requests

5 participants