I want to deploy Next.Js website.
I use 2 Netlify CLI commands:
netlify build
netlify deploy --prod
I get next output:
────────────────────────────────────────────────────────────────
Netlify Build
────────────────────────────────────────────────────────────────
> Version
@netlify/build 26.2.6
> Flags
dry: false
offline: false
> Current directory
C:\Source\mysite-fe
> Config file
C:\Source\mysite-fe\netlify.toml
> Context
production
> Loading plugins
- @netlify/plugin-nextjs@4.2.5 from netlify.toml and package.json
────────────────────────────────────────────────────────────────
1. @netlify/plugin-nextjs (onPreBuild event)
────────────────────────────────────────────────────────────────
Next.js cache restored.
Netlify configuration property "build.environment.NEXT_PRIVATE_TARGET" value changed.
(@netlify/plugin-nextjs onPreBuild completed in 1.5s)
────────────────────────────────────────────────────────────────
2. build.command from netlify.toml
────────────────────────────────────────────────────────────────
$ next build
info - Loaded env from C:\Source\mysite-fe\.env
info - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
info - Checking validity of types
./src/components/DropDownMenu.tsx
53:10 Warning: 'theme' is defined but never used. @typescript-eslint/no-unused-vars
./src/components/Footer.tsx
61:34 Warning: 'props' is defined but never used. @typescript-eslint/no-unused-vars
./src/components/ResortThemesTesting.tsx
17:7 Warning: 'styles' is assigned a value but never used. @typescript-eslint/no-unused-vars
info - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules
info - Using external babel configuration from C:\Source\mysite-fe\babel.config.js
info - Creating an optimized production build
info - Compiled successfully
info - Collecting page data
info - Generating static pages (20/20)
info - Finalizing page optimization
Page Size First Load JS
┌ /_app 0 B 86.7 kB
├ ● /[[...path]] (ISR: 5 Seconds) (21113 ms) 95.2 kB 182 kB
├ ├ /en/Demo (5120 ms)
├ ├ /en/Demo2 (5110 ms)
├ ├ /en/Home-App-Route-1 (4925 ms)
├ ├ /en/test/styleguide (595 ms)
├ ├ /en/test/layout-test (563 ms)
├ ├ /en (516 ms)
├ ├ /en/test/Two-Columns-Page (375 ms)
├ └ [+11 more paths] (avg 355 ms)
├ ○ /404 386 B 87.1 kB
├ λ /api/editing/data/[key] 0 B 86.7 kB
└ λ /api/editing/render 0 B 86.7 kB
+ First Load JS shared by all 86.7 kB
├ chunks/framework.d0785a.js 47.1 kB
├ chunks/main.6b46eb.js 28.1 kB
├ chunks/pages/_app.3df498.js 9.82 kB
├ chunks/webpack.c3c23c.js 1.61 kB
└ css/3e41dfccbd5513499ec6.css 25.9 kB
λ (Server) server-side renders at runtime (uses getInitialProps or getServerSideProps)
○ (Static) automatically rendered as static HTML (uses no initial props)
● (SSG) automatically generated as static HTML + JSON (uses getStaticProps)
(ISR) incremental static regeneration (uses revalidate in getStaticProps)
(build.command completed in 1m 29.3s)
────────────────────────────────────────────────────────────────
3. @netlify/plugin-nextjs (onBuild event)
────────────────────────────────────────────────────────────────
Patching C:\Source\mysite-fe\node_modules\next\dist\server\next-server.js
Done
Moving static page files to serve from CDN...
Moved 0 files
The following routes use "revalidate" values of under 60 seconds, which is not supported.
They will use a revalidate time of 60 seconds instead.
┌─────────┬─────────────────────────────────────────────┬────────────┐
│ (index) │ Route │ Revalidate │
├─────────┼─────────────────────────────────────────────┼────────────┤
│ 0 │ '/en/Demo2' │ 5 │
│ 1 │ '/en/Demo' │ 5 │
│ 2 │ '/en/Home-App-Route-1' │ 5 │
│ 3 │ '/en/test/layout-test/a1' │ 5 │
│ 4 │ '/en/test/Test-Page' │ 5 │
│ 5 │ '/en/test/Three-Columns-App-Route' │ 5 │
│ 6 │ '/en/test/Two-Columns-Page' │ 5 │
│ 7 │ '/en/test/New-Carousel-App-Route' │ 5 │
│ 8 │ '/en/test/dynamic-tables' │ 5 │
│ 9 │ '/en/test/layout-test' │ 5 │
│ 10 │ '/en/test/Anton-Test' │ 5 │
│ 11 │ '/en/test/ehren-test' │ 5 │
│ 12 │ '/en/test/image-with-title-and-description' │ 5 │
│ 13 │ '/en/test/rich-text-editor' │ 5 │
│ 14 │ '/en/test' │ 5 │
│ 15 │ '/en/test/styleguide/custom-route-type' │ 5 │
│ 16 │ '/en/test/styleguide' │ 5 │
│ 17 │ '/en' │ 5 │
└─────────┴─────────────────────────────────────────────┴────────────┘
Netlify configuration property "redirects" value changed to [
{ from: '/_next/static/*', to: '/static/:splat', status: 200 },
{
from: '/:locale/_next/static/*',
to: '/static/:splat',
status: 200
},
{
from: '/_next/image*',
query: { url: ':url', w: ':width', q: ':quality' },
to: '/_ipx/w_:width,q_:quality/:url',
status: 301
},
{ from: '/_ipx/*', to: '/.netlify/builders/_ipx', status: 200 },
{ from: '/cache/*', to: '/404.html', status: 404, force: true },
{ from: '/server/*', to: '/404.html', status: 404, force: true },
{ from: '/serverless/*', to: '/404.html', status: 404, force: true },
{ from: '/traces', to: '/404.html', status: 404, force: true },
{
from: '/routes-manifest.json',
to: '/404.html',
status: 404,
force: true
},
{
from: '/build-manifest.json',
to: '/404.html',
status: 404,
force: true
},
{
from: '/prerender-manifest.json',
to: '/404.html',
status: 404,
force: true
},
{
from: '/react-loadable-manifest.json',
to: '/404.html',
status: 404,
force: true
},
{ from: '/BUILD_ID', to: '/404.html', status: 404, force: true },
{
from: '/',
to: '/.netlify/functions/___netlify-handler',
status: 200,
force: true,
conditions: { Cookie: [Array] }
},
{
from: '/api',
to: '/.netlify/functions/___netlify-handler',
status: 200
},
{
from: '/api/*',
to: '/.netlify/functions/___netlify-handler',
status: 200
},
{
from: '/favicon.ico',
to: '/favicon.ico',
conditions: { Cookie: [Array] },
status: 200
},
{
from: '/mysite-logo-trans.png',
to: '/mysite-logo-trans.png',
conditions: { Cookie: [Array] },
status: 200
},
{
from: '/robots.txt',
to: '/robots.txt',
conditions: { Cookie: [Array] },
status: 200
},
{
from: '/sc_logo.svg',
to: '/sc_logo.svg',
conditions: { Cookie: [Array] },
status: 200
},
{
from: '/*',
to: '/.netlify/functions/___netlify-handler',
status: 200,
conditions: { Cookie: [Array] },
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/Demo2.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/Demo2',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/Demo.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/Demo',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/Home-App-Route-1.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/Home-App-Route-1',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/layout-test/a1.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/layout-test/a1',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/Test-Page.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/Test-Page',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/Three-Columns-App-Route.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/Three-Columns-App-Route',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/Two-Columns-Page.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/Two-Columns-Page',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/New-Carousel-App-Route.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/New-Carousel-App-Route',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/dynamic-tables.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/dynamic-tables',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/layout-test.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/layout-test',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/Anton-Test.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/Anton-Test',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/ehren-test.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/ehren-test',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/image-with-title-and-description.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/image-with-title-and-description',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/rich-text-editor.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/rich-text-editor',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/styleguide/custom-route-type.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/styleguide/custom-route-type',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/test/styleguide.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/test/styleguide',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/en',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: true
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en.json',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: false
},
{
from: '/_next/data/q6PCt1QSLak-jmuDJsnrW/en/*',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: false
},
{
from: '/',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: false
},
{
from: '/*',
to: '/.netlify/builders/___netlify-odb-handler',
status: 200,
force: false
},
{
from: '/*',
to: '/.netlify/functions/___netlify-handler',
status: 200
}
].
(@netlify/plugin-nextjs onBuild completed in 764ms)
────────────────────────────────────────────────────────────────
4. Functions bundling
────────────────────────────────────────────────────────────────
The Netlify Functions setting targets a non-existing directory: netlify\functions
Packaging Functions from .netlify\functions-internal directory:
- _ipx\_ipx.js
- ___netlify-handler\___netlify-handler.js
- ___netlify-odb-handler\___netlify-odb-handler.js
(Functions bundling completed in 50.4s)
────────────────────────────────────────────────────────────────
5. @netlify/plugin-nextjs (onPostBuild event)
────────────────────────────────────────────────────────────────
Next.js cache saved.
(@netlify/plugin-nextjs onPostBuild completed in 1.5s)
────────────────────────────────────────────────────────────────
Netlify Build Complete
────────────────────────────────────────────────────────────────
I expect that my website https://mysite-test20220214.netlify.app/ will be available, but I get 404. Or at least https://mysite-test20220214.netlify.app/en should be available, but I get 404. Instead pages are available only under https://mysite-test20220214.netlify.app/server/pages/en.html.
My Netlify.toml:
# example netlify.toml
[build]
command = "next build"
functions = "netlify/functions"
publish = ".next"
[[plugins]]
package = "@netlify/plugin-nextjs"
My packages.json:
{
"name": "mysite",
"description": "Application utilizing Sitecore JavaScript Services and Next.js",
"version": "19.0.0",
"private": true,
"config": {
"appName": "mysite",
"rootPlaceholders": [
"jss-main"
],
"sitecoreConfigPath": "/App_Config/Include/zzz",
"graphQLEndpointPath": "/sitecore/api/graph/edge",
"language": "en"
},
"engines": {
"node": ">=8.1",
"npm": ">=5.6.0",
"yarn": "yarn is not supported, please use npm"
},
"author": {
"name": "Sitecore Corporation",
"url": "https://jss.sitecore.com"
},
"repository": {
"type": "git",
"url": "git+https://github.com/sitecore/jss.git"
},
"bugs": {
"url": "https://github.com/sitecore/jss/issues"
},
"license": "Apache-2.0",
"scripts": {
"jss": "jss",
"bootstrap": "ts-node --project tsconfig.scripts.json scripts/bootstrap.ts && graphql-let",
"build": "npm-run-all --serial bootstrap next:build",
"graphql:update": "ts-node --project tsconfig.scripts.json ./scripts/fetch-graphql-introspection-data.ts",
"next:build": "next build",
"next:dev": "cross-env NODE_OPTIONS='--inspect' next dev",
"next:start": "next start",
"scaffold": "ts-node --project tsconfig.scripts.json scripts/scaffold-component.ts",
"start:connected": "npm-run-all --serial bootstrap --parallel next:dev start:watch-components",
"start": "cross-env-shell JSS_MODE=disconnected \"npm-run-all --serial bootstrap --parallel next:dev start:disconnected-proxy start:watch-components\"",
"start:disconnected-proxy": "ts-node --project tsconfig.scripts.json ./scripts/disconnected-mode-proxy.ts",
"start:production": "npm-run-all --serial bootstrap next:build next:start",
"start:watch-components": "ts-node --project tsconfig.scripts.json scripts/generate-component-factory.ts --watch",
"test": "jest",
"test-watch": "jest --watch **/*.ts*",
"lint": "npx eslint ./src ./sitecore/definitions/**/*.ts ./scripts/**/*.ts ./data/**/*.yml",
"lint-fix": "npx eslint --fix ./src ./sitecore/definitions/**/*.ts ./scripts/**/*.ts ./data/**/*.yml"
},
"dependencies": {
"@emotion/babel-plugin": "^11.7.2",
"@emotion/babel-preset-css-prop": "^11.2.0",
"@emotion/react": "^11.7.1",
"@emotion/styled": "^11.6.0",
"@mui/icons-material": "^5.3.0",
"@mui/material": "^5.3.0",
"@mui/styles": "^5.3.0",
"@sitecore-jss/sitecore-jss-nextjs": "^19.0.0",
"@sitecore-jss/sitecore-jss-tracking": "^19.0.0",
"bootstrap": "^4.6.1",
"deep-equal": "^2.0.5",
"graphql": "~15.4.0",
"graphql-tag": "^2.11.0",
"next": "^11.0.1",
"next-localization": "^0.10.0",
"next-on-netlify": "^3.0.1",
"nprogress": "~0.2.0",
"react": "^17.0.2",
"react-bootstrap": "^2.1.1",
"react-cookie": "^4.1.1",
"react-dom": "^17.0.2",
"react-material-ui-carousel": "^3.1.1"
},
"devDependencies": {
"@graphql-codegen/cli": "^1.19.1",
"@graphql-codegen/plugin-helpers": "^1.18.1",
"@graphql-codegen/typed-document-node": "^1.18.4",
"@graphql-codegen/typescript": "^1.21.1",
"@graphql-codegen/typescript-operations": "^1.17.9",
"@graphql-codegen/typescript-resolvers": "^1.17.10",
"@graphql-typed-document-node/core": "^3.1.0",
"@netlify/plugin-nextjs": "^4.2.5",
"@sitecore-jss/sitecore-jss-cli": "^19.0.2",
"@sitecore-jss/sitecore-jss-dev-tools": "^19.0.0",
"@sitecore-jss/sitecore-jss-manifest": "^19.0.0",
"@testing-library/jest-dom": "^5.16.1",
"@testing-library/react": "^12.1.2",
"@types/deep-equal": "^1.0.1",
"@types/node": "^14.6.4",
"@types/nprogress": "^0.2.0",
"@types/react": "^17.0.15",
"@types/react-dom": "^17.0.9",
"@typescript-eslint/eslint-plugin": "^4.29.1",
"@typescript-eslint/parser": "^4.29.1",
"axios": "^0.21.1",
"babel-jest": "^27.4.6",
"chalk": "~2.4.2",
"chokidar": "~3.1.1",
"constant-case": "^3.0.4",
"cross-env": "~6.0.3",
"eslint": "^7.32.0",
"eslint-config-next": "^11.0.1",
"eslint-config-prettier": "^6.15.0",
"eslint-plugin-prettier": "^3.1.4",
"eslint-plugin-yaml": "^0.2.0",
"graphql-let": "^0.16.2",
"jest": "^27.4.7",
"netlify-cli": "^9.2.0",
"npm-run-all": "~4.1.5",
"prettier": "^2.1.2",
"ts-node": "^9.0.0",
"typescript": "~4.3.5",
"yaml-loader": "^0.6.0"
}
}
What do I do wrong?
P.S.
netlify dev works as expected. Site works without any issues.