ServiceScope' is not assignable

EMaarten commented 2 years ago

Version

Please specify what version of the library you are using: [3.8.0]

Expected / Desired Behavior / Question

Building SPFx project should be successful.

Observed Behavior

Error when building SPFx project:

Argument of type 'import("[Path To Project]/node_modules/@microsoft/sp-page-context/node_modules/@microsoft/sp-core-library/dist/index-internal").ServiceKey<import("[Path To Project]/node_modules/@microsoft/sp-page-context/dist/index-internal").PageContext>' is not assignable to parameter of type 'import("[Path To Project]/node_modules/@microsoft/sp-core-library/dist/index-internal").ServiceKey<import("[Path To Project]/node_modules/@microsoft/sp-page-context/dist/index-internal").PageContext>'. Types of property 'defaultCreator' are incompatible. Type 'import("[Path To Project]/node_modules/@microsoft/sp-page-context/node_modules/@microsoft/sp-core-library/dist/index-internal").ServiceCreator<import("[Path To Project]/node_modules/@microsoft/sp-page-context/dist/index-internal").PageContext>' is not assignable to type 'import("[Path To Project]/node_modules/@microsoft/sp-core-library/dist/index-internal").ServiceCreator<import("[Path To Project]/node_modules/@microsoft/sp-page-context/dist/index-internal").PageContext>'. Types of parameters 'serviceScope' and 'serviceScope' are incompatible. Type 'import("[Path To Project]/node_modules/@microsoft/sp-core-library/dist/index-internal").ServiceScope' is not assignable to type 'import("[Path To Project]/node_modules/@microsoft/sp-page-context/node_modules/@microsoft/sp-core-library/dist/index-internal").ServiceScope'. Types have separate declarations of a private property '_registrations'

Steps to Reproduce

Build an SPFx project with version 1.13.1, office-ui-fabric-react 7.174.1 and pnp/spfx-controls-react 3.8.0. Add a service class with the following code:

import { ServiceKey, ServiceScope } from "@microsoft/sp-core-library";
import { PageContext } from "@microsoft/sp-page-context";

export interface IMyService {
    getSomething():Promise<string>;
}

export class MyService {

    public static readonly serviceKey: ServiceKey<IMyService> = ServiceKey.create<IMyService>('HelloWorld:MyService', MyService);

    constructor(serviceScope: ServiceScope) {        
        serviceScope.whenFinished(() => {
            const pageContext = serviceScope.consume(PageContext.serviceKey);                                          
        });                
    }

    public async getSomething() : Promise<string>{
        return "";
    }
}