Said BADAOUI

NextJs has better support for absolute imports and aliases. It is now possible to set a baseUrl in jsconfig.json. This file also has support for paths now.

// tsconfig.json or jsconfig.json
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/ui/*": ["components/*"]
}
}
}
// Imports 'components/ui/input'
import Input from '@/ui/input'

Thank you :)

nextjs tips series — static HTML export

next exportexports your app to static HTML, which can be run standalone without the need of a Node.js server (for those who want to buy a template on HTML format on any marketplace like Envato ThemeForest, etc..).

The exported app supports almost every feature of Next.js, incl. dynamic routes, prefetching…

The 500 errors are handled both client-side and server-side by the Error component.

If you wish to override it, define the file pages/_error.js and add the following code.

// pages/_error.js
function Error({ statusCode }) {
return (
<p>
{statusCode
? `An error ${statusCode} occurred on server`
: 'An error occurred on client'}
</p>
)
}

Error.getInitialProps = ({ res, err }) => {
const statusCode = res ? res.statusCode : err ? err.statusCode : 404
return { statusCode }
}

export default Error;

Thank you :)