Buildable libraries cannot import or export from non-buildable libraries (eslint) - nomachine-nx

Question

I am getting above error when i import the interface from one of the library:
import { DetailsProps } from '#vite/prop-types'; //error
import styles from './header.module.less';
const initailDetails: DetailsProps = {
name: 'Arif',
city: 'Chennai',
pin: 600019,
};
export function Header() {
return (
<div className={styles['container']}>
<h1>Welcome to Header!</h1>
<ul>
{Object.values(initailDetails).map((v) => (
<li key={v}>{v}</li>
))}
</ul>
</div>
);
}
Nx report:
Node : 16.13.2
OS : darwin arm64
npm : 8.1.2
nx : 15.3.3
#nrwl/angular : Not Found
#nrwl/cypress : 15.3.3
#nrwl/detox : Not Found
#nrwl/devkit : 15.3.3
#nrwl/esbuild : Not Found
#nrwl/eslint-plugin-nx : 15.3.3
#nrwl/expo : Not Found
#nrwl/express : Not Found
#nrwl/jest : Not Found
#nrwl/js : 15.3.3
#nrwl/linter : 15.3.3
#nrwl/nest : Not Found
#nrwl/next : Not Found
#nrwl/node : Not Found
#nrwl/nx-cloud : Not Found
#nrwl/nx-plugin : Not Found
#nrwl/react : 15.3.3
#nrwl/react-native : Not Found
#nrwl/rollup : Not Found
#nrwl/schematics : Not Found
#nrwl/storybook : Not Found
#nrwl/web : Not Found
#nrwl/webpack : Not Found
#nrwl/workspace : 15.3.3
typescript : 4.8.4
---------------------------------------
Local workspace plugins:
---------------------------------------
Community plugins:
#nrwl/vite: 15.3.3

Answer 1

This is because of the linter, you can disable it by setting false for enforceBuildableLibDependency in .eslintrc.json file.
or you can disable it by adding this comment before importing it:
// eslint-disable-next-line #nrwl/nx/enforce-module-boundaries
import { DetailsProps } from '#vite/prop-types';