It is not advisable to import unnecessary modules in a component. It's best practice to only import the required modules.
In your example, you are importing modules that are not needed everywhere.
Step 1
A better approach would be to create named exports directly from the model files themselves. This way, not everything will be exported from the file.
For example, a file like bird.model.ts could have the following structure:
export interface Bird {
birdId: number;
birdName: string;
}
Step 2
If you place all these interfaces inside a folder (let's say named model), you can create an index.ts file within the model folder. The content of this file would look like this:
export { Bird } from './bird.model'
export { Mammal } from './mammal.model'
export { Amphibian } from './amphibian.model'
Instead of exporting everything using *, we are now specifically exporting the model interface names.
Step 3
When a Component needs to use a specific model (such as Bird), there are two ways to import it.
import { Bird } from './models';
This will load all exports from the index.ts file in the models folder and then import Bird.
However, if you only require Bird, you can go one level deeper and import Bird directly from ./model/bird.model, like this:
import { Bird } from './models/bird.model';
This method ensures that only what is exported by bird.model is loaded, instead of everything in the index.ts file in the models folder, before importing Bird.
I hope this explanation clarifies how it works for you.
You can also refer to this Sample StackBlitz for reference.