Next version 9.5.3 introduces breaking changes to _app.tsx when using Yarn

[DopamineDriven]

Bug report

Describe the bug

Next version 9.5.3 breaks when used with yarn. I remade a repo using npm instead and it was smooth sailing.

error - ./pages/_app.tsx
Error: C:\Users\Anthr\asross-portfolio\pages\_app.tsx: Invalid page config export found. Expected object but got import in file \pages\_app.tsx. See: https://err.sh/vercel/next.js/invalid-page-config 
event - build page: /next/dist/pages/_error
wait  - compiling...
error - ./pages/_app.tsx
Error: C:\Users\Anthr\asross-portfolio\pages\_app.tsx: Invalid page config export found. Expected object but got import in file \pages\_app.tsx. See: https://err.sh/vercel/next.js/invalid-page-config 
Error: Cannot find module 'C:\Users\Anthr\asross-portfolio\.next\build-manifest.json'
Require stack:
- C:\Users\Anthr\asross-portfolio\node_modules\next\dist\next-server\server\load-components.js
- C:\Users\Anthr\asross-portfolio\node_modules\next\dist\next-server\server\api-utils.js
- C:\Users\Anthr\asross-portfolio\node_modules\next\dist\next-server\server\next-server.js
- C:\Users\Anthr\asross-portfolio\node_modules\next\dist\server\next.js
- C:\Users\Anthr\asross-portfolio\node_modules\next\dist\server\lib\start-server.js
- C:\Users\Anthr\asross-portfolio\node_modules\next\dist\cli\next-dev.js
- C:\Users\Anthr\asross-portfolio\node_modules\next\dist\bin\next

A clear and concise description of what the bug is. "Invalid page config export found. Expected object but got import in file pages\ _app.tsx."

To Reproduce

Create a next project using yarn. In _app.tsx, use the following code

import 'styles/index.css';
import '@tailwindcss/typography';
import { AppProps } from 'next/app';
import { ReactElement } from 'react';

export function reportWebVitals(metric: any): void {
    console.log(metric);
}

function App({ Component, pageProps }: AppProps): ReactElement {
    return <Component {...pageProps} />;
}

export default App;

Steps to reproduce the behavior, please provide code snippets or a repository:

1. Go to '...' Go to a next typescript repository that uses yarn instead of npm. update your next version to 9.5.3
2. Click on '....' Launch yarn dev. It will throw an event /next/dist/pages/_error
3. Scroll down to '....' Cannot find module ...build-manifest.json
4. See error

Expected behavior

Expected _app.tsx to not unforeseeably error out.

Screenshots

If applicable, add screenshots to help explain your problem. Launching with next version 9.5.3 Rolling the version back to next version 9.5.2 Next launches successfully on yarn dev with next 9.5.2

System information

• OS: Windows
• Version of Next.js: 9.5.3 introduces breaking changes
• Version of Node.js: 14.10

Additional context

Add any other context about the problem here. Rollback your next version to 9.5.2 to resolve the error if using typescript and yarn with next until the breaking changes are resolved by the vercel/next team.

[laugharn]

I believe this was fixed in 9.5.4-canary.4: https://github.com/vercel/next.js/pull/16834

[DopamineDriven]

@laugharn you are correct. I just ran yarn add next@9.5.4 and that resolved the issue as well. When running yarn add next without targeting a version explicitly it installs next 9.5.3. Thanks for the prompt response!

[timneutkens]

Fixed in #16834 indeed.

[balazsorban44]

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.