So basically, any configuration file such as next.config or postcss.config that is not a ts file, throws a next/babel parsing error if the project folder is not opened directly but from a parent folder containing the project.

Opening the project directly does not throw such error. Although everything works both from parent folder and project folder. so why the error is occuring?

Parsing error: Cannot find module 'next/babel'
Require stack:
- project\node_modules\next\dist\compiled\babel\bundle.js
- project\gos-web\node_modules\next\dist\compiled\babel\eslint-parser.js
- project\node_modules\eslint-config-next\parser.js
- project\node_modules\@eslint\eslintrc\dist\eslintrc.cjs

Make sure that all the Babel plugins and presets you are using
are defined as dependencies or devDependencies in your package.json
file. It's possible that the missing plugin is loaded by a preset
you are using that forgot to add the plugin to its dependencies: you
can workaround this problem by explicitly adding the missing package
to your top-level package.json.eslint

error is thrown like this. Since this appears to be eslint error, i went to eslint error and adding next/babel to extend array and error gone away.

But why the error in the first place?