Single-page application: Code configuration

import { PublicClientApplication } from "@azure/msal-browser";
import { MsalProvider } from "@azure/msal-react";

// Configuration object constructed.
const config = {
 auth: {
 clientId: 'your_client_id'
 }
};

// create PublicClientApplication instance
const publicClientApplication = new PublicClientApplication(config);

// Wrap your app component tree in the MsalProvider component
ReactDOM.render(
 <React.StrictMode>
 <MsalProvider instance={publicClientApplication}>
 <App />
 </ MsalProvider>
 </React.StrictMode>,
 document.getElementById('root')
);

import * as Msal from "@azure/msal-browser"; // if using CDN, 'Msal' will be available in global scope

// Configuration object constructed.
const config = {
 auth: {
 clientId: 'your_client_id'
 }
};

// create PublicClientApplication instance
const publicClientApplication = new Msal.PublicClientApplication(config);

// In app.module.ts
import { MsalModule } from '@azure/msal-angular';
import { PublicClientApplication } from '@azure/msal-browser';

@NgModule({
 imports: [
 MsalModule.forRoot( new PublicClientApplication({
 auth: {
 clientId: 'Enter_the_Application_Id_Here',
 }
 }), null, null)
 ]
})
export class AppModule { }