Absolute imports in Next.js
Frontend Developer at JetRockets
When I was working on my first project with Next.js I spent a lot of time to find how to use absolute imports. The solution turned out to be quite simple. You need to indicate this resolve option in your next.config.js file:
module.exports = {
webpack(config) {
config.resolve.modules.push(__dirname)
return config;
},
}
Or if you want to add absolute path only for one directory you can use alias:
module.exports = {
webpack(config) {
config.resolve.alias['components'] = path.join(__dirname, 'components');
return config;
},
}
