Nextjs Warning: "root value has unexpected property" with @expo/next-adapter

[ericvicenti]

Summary

Hi friends, this is low-priority because nothing is broken. But there is log spew from next now whenever I run with @expo/next-adapter and its a little embarrassing. Pretty sure this was caused by nextjs adding the warning recently

See the "error output" for the warning. Again, this is not an exception or a breakage

Side note: I realized that yarn next-expo is confused about typescript and created .js files alongside my .tsx files. But this may be due to my monorepo setup and I don't have time to isolate that issue. Also I had to add back next-transpile-modules to my next.config.js in order get things working in the monorepo after yarn next-expo did its thing 🤷‍♂️ these are perhaps more severe issues for people trying to set up a next+expo+ts repo

Thank youuu, kind Expo people 😍

Environment

latest expo things

    "expo": "^46.0.8",
    "@expo/config-types": "^46.0.2",
    "@expo/next-adapter": "^4.0.12",

latest next things

    "next": "12.2.5",
    "next-compose-plugins": "^2.2.1",
    "next-transpile-modules": "^9.0.0",

Please specify your device/emulator/simulator platform, model and version

macOS node 16.17.0

Error output

$ yw bug-expo-next-adapter dev
yarn workspace v1.22.19
yarn run v1.22.19
$ next dev
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
warn  - Invalid next.config.js options detected: 
  - The root value has an unexpected property, webpackDevMiddleware, which is not in the list of allowed properties (amp, analyticsId, assetPrefix, basePath, cleanDistDir, compiler, compress, crossOrigin, devIndicators, distDir, env, eslint, excludeDefaultMomentLocales, experimental, exportPathMap, future, generateBuildId, generateEtags, headers, httpAgentOptions, i18n, images, onDemandEntries, optimizeFonts, output, outputFileTracing, pageExtensions, poweredByHeader, productionBrowserSourceMaps, publicRuntimeConfig, reactStrictMode, redirects, rewrites, sassOptions, serverRuntimeConfig, staticPageGenerationTimeout, swcMinify, trailingSlash, typescript, useFileSystemPublicRoutes, webpack).
  - The root value has an unexpected property, configOrigin, which is not in the list of allowed properties (amp, analyticsId, assetPrefix, basePath, cleanDistDir, compiler, compress, crossOrigin, devIndicators, distDir, env, eslint, excludeDefaultMomentLocales, experimental, exportPathMap, future, generateBuildId, generateEtags, headers, httpAgentOptions, i18n, images, onDemandEntries, optimizeFonts, output, outputFileTracing, pageExtensions, poweredByHeader, productionBrowserSourceMaps, publicRuntimeConfig, reactStrictMode, redirects, rewrites, sassOptions, serverRuntimeConfig, staticPageGenerationTimeout, swcMinify, trailingSlash, typescript, useFileSystemPublicRoutes, webpack).
  - The root value has an unexpected property, target, which is not in the list of allowed properties (amp, analyticsId, assetPrefix, basePath, cleanDistDir, compiler, compress, crossOrigin, devIndicators, distDir, env, eslint, excludeDefaultMomentLocales, experimental, exportPathMap, future, generateBuildId, generateEtags, headers, httpAgentOptions, i18n, images, onDemandEntries, optimizeFonts, output, outputFileTracing, pageExtensions, poweredByHeader, productionBrowserSourceMaps, publicRuntimeConfig, reactStrictMode, redirects, rewrites, sassOptions, serverRuntimeConfig, staticPageGenerationTimeout, swcMinify, trailingSlash, typescript, useFileSystemPublicRoutes, webpack).
  - The root value has an unexpected property, webpack5, which is not in the list of allowed properties (amp, analyticsId, assetPrefix, basePath, cleanDistDir, compiler, compress, crossOrigin, devIndicators, distDir, env, eslint, excludeDefaultMomentLocales, experimental, exportPathMap, future, generateBuildId, generateEtags, headers, httpAgentOptions, i18n, images, onDemandEntries, optimizeFonts, output, outputFileTracing, pageExtensions, poweredByHeader, productionBrowserSourceMaps, publicRuntimeConfig, reactStrictMode, redirects, rewrites, sassOptions, serverRuntimeConfig, staticPageGenerationTimeout, swcMinify, trailingSlash, typescript, useFileSystemPublicRoutes, webpack).
  - The root value has an unexpected property, projectRoot, which is not in the list of allowed properties (amp, analyticsId, assetPrefix, basePath, cleanDistDir, compiler, compress, crossOrigin, devIndicators, distDir, env, eslint, excludeDefaultMomentLocales, experimental, exportPathMap, future, generateBuildId, generateEtags, headers, httpAgentOptions, i18n, images, onDemandEntries, optimizeFonts, output, outputFileTracing, pageExtensions, poweredByHeader, productionBrowserSourceMaps, publicRuntimeConfig, reactStrictMode, redirects, rewrites, sassOptions, serverRuntimeConfig, staticPageGenerationTimeout, swcMinify, trailingSlash, typescript, useFileSystemPublicRoutes, webpack).
  - The value at .amp.canonicalBase must be 1 character or more but it was 0 characters.
  - The value at .assetPrefix must be 1 character or more but it was 0 characters.
  - The value at .experimental.outputFileTracingRoot must be 1 character or more but it was 0 characters.
  - The value at .i18n must be an object but it was null.

See more info here: https://nextjs.org/docs/messages/invalid-next-config
info  - Disabled SWC as replacement for Babel because of custom Babel configuration "babel.config.js" https://nextjs.org/docs/messages/swc-disabled
info  - automatically enabled Fast Refresh for 1 custom loader

Reproducible demo or steps to reproduce from a blank project

minimal example is here in my monorepo: https://github.com/zerve-app/zerve/tree/main/apps/bug-expo-next-adapter

heres the next.config.js: https://github.com/zerve-app/zerve/blob/main/apps/bug-expo-next-adapter/next.config.js

for the sake of your bandwidth and ssd, please shallow clone:

git clone --depth=1 [email protected]:zerve-app/zerve.git
cd zerve
yarn --frozen-lockfile

then start:

yarn workspace bug-expo-next-adapter dev

[TimSusa]

Same here, as we have a mouth full of warnings after updating like exactly the same

[fdorantesm]

Same here, as we have a mouth full of warnings after updating like exactly the same

Same here with a SSR next application. When src/middleware.ts exists breaks building in Amplify.

Works fine in local. It would be a next bug with the latest version.

[nandorojo]

@fdorantesm how do you keep your page sizes so small?

[fdorantesm]

@fdorantesm how do you keep your page sizes so small?

It's a small webapp, it has small components and it's using SSR methods. Do you have an app with bigger pages?

[mr-rpl]

Same here, as we have a mouth full of warnings after updating like exactly the same

Same here with a SSR next application. When src/middleware.ts exists breaks building in Amplify.

Works fine in local. It would be a next bug with the latest version.

@fdorantesm - also encountering this issue with middleware and Amplify -- were you able to find a way around this?

[nanomonrab]

Same here, as we have a mouth full of warnings after updating like exactly the same

Same here with a SSR next application. When src/middleware.ts exists breaks building in Amplify. Works fine in local. It would be a next bug with the latest version.

@fdorantesm - also encountering this issue with middleware and Amplify -- were you able to find a way around this?

I created a high order component that checks the stored token in the API.