# Absolute imports in Next.js

> Learn how to set up absolute imports in Next.js by adding a jsconfig.json file with baseUrl set to the project root, so you can drop those relative paths.

Author: [Flavio Copes](https://flaviocopes.com/about/) | Published: 2021-05-11 | Topics: [Next.js](https://flaviocopes.com/tags/next/) | Canonical: https://flaviocopes.com/nextjs-absolute-imports/

Wouldn't it be great if we could avoid relative paths in imports, in our [React](https://flaviocopes.com/react/) components in [Next.js](https://flaviocopes.com/nextjs/)? 

So instead of for example:

```js
import Layout from '../../components/layout'
```

We could just write:

```js
import Layout from 'components/layout'
```

This is possible, and it's called **absolute imports**.

Just add a file named `jsconfig.json` in the root of your project with this content:

```json
{
  "compilerOptions": {
    "baseUrl": "."
  }
}
```

That's it, absolute imports will start working.