ES6 import gets undefined,import, only one gets the same js file, and the others get undefined?.

in the project created by vue-cli,
creates a BaseService.js:
export default class BaseService {}
and then some other Service inherits BaseService:
UserService.js:

.

import BaseService from". / BaseService";
console.log ( UserService: ${BaseService} );
export default class UserService extends BaseService {}
TestService.js:

import BaseService from". / BaseService";
console.log ( TestService: ${BaseService} );
export default class TestService extends BaseService {}
then the result is:
UserService can introduce undefined on the other side of BaseService, TestService;

if UserService does not introduce BaseService, but only TestService, TestService can be introduced successfully!?

is it as if this BaseService can only be introduced once? What?

I would like to ask all kinds of roads, what is the situation?

Nov.12,2021
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b3b65a-e7dd.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b3b65a-e7dd.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?