Embed Lightning Component in the Visualforce page.

 

Try this code:

Create a Lightning component:

App: LightningApp

<aura:application access="GLOBAL" extends="ltng:outApp" >

<c:LightningComponent/>

</aura:application>

Component: LightningComponent

<apex:page >

    <apex:includeLightning />

    <div id="Con" />

    <script>

        $Lightning.use("c:LightningApp", function() {

            $Lightning.createComponent(

                "c:LightningComponent",

                {},

                "Con",

                function(cmp) {

                    console.log("Component is created!");

                    console.log(cmp);

                });

            });        

      </script>

</apex:page>

Reference:  https://www.forcetalks.com/blog/use-lightning-component-in-visualforce-page/