this is my configuration

enter image description here

but Next.js gave me this warning

enter image description here

CodePudding user response：

I'm sorry. This is my first question on StackOverflow

Here's how I solved it: Since my Next.JS is the TypeScript project so, my project has tsconfig.json

1. Add baseUrl and paths, parse to the IDE

// tsconfig.json
{
  "compilerOptions": {
     "baseUrl": ".",
    "paths": {
      "@/components/*": ["components/*"]
    }
  }
}

2. Aliases are configured in webpack.js

// next.config.js
const path = require('path')
/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  swcMinify: true,
}

module.exports = {
  ...nextConfig,
  webpack: (config,
    { buildId, dev, isServer, defaultLoaders, nextRuntime, webpack }) => {
    config.resolve.alias = {
      ...config.resolve.alias,
      '@': path.resolve(__dirname),
      '@/components': path.resolve(__dirname, 'components'),
    }
    return config
  },
}

3. use

import Layout from '@/components/Layout'

CodePudding user response：

This is most likely the https://www.npmjs.com/package/module-alias

It has nothing to do with NextJs.