function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
John Caffrey 4John Caffrey 4 

Getting an "Incorrect usage of ltng:outApp" error when trying to preview a Lightning Out Dependency App

Hi folks,
Wondering what I'm doing wrong here... any assistance would be great.

I've created a new Lightning Out dependency app but using the generated code...

<aura:application access="global" extends="ltng:outApp" >
<aura:dependency resource="c:MyLookupComponent" />
</aura:application>


... if I try to preview it in the browser, I get the following unhelpful error message...

This page has an error. You might just need to refresh it.
Error during init [Action failed: ltng:outApp$controller$init [Incorrect usage of ltng:outApp. Refer 'Lightning Components Developer Guide' for correct usage]]


Note: from looking in the browser's console output, the app is definitely loading... i.e. I'm seeing:

execAuraJs: 1,223.14 ms
runInitAsync: 1,234.956 ms
runAfterContextCreated: 1,261.672 ms
runAfterInitDefsReady: 1,542.987 ms
runAfterBootstrapReady: 2,110.847 ms
appCreationStart: 2,116.047 ms


Any suggestions on potential causes and/or how to troubleshoot would be great. (I get the same error in both IE and Chrome.)

Thanks!
John
 
Karan Shekhar KaulKaran Shekhar Kaul
Hi John,

Which container are you using to run this application? Are you running this lightning out in VF container? I guess, making any app as lightning out app will require a container to run.
Jordan VasquezJordan Vasquez
Hi John,

Have you ever figured this out? I am currently hitting this myself and can't find anything online.

Thanks!
Jordan
Fred The DevFred The Dev
Karan's answer is correct. I was running into the same issue trying to preview the lightning app from the developer console. When previewing the VisualForce page the lightning app is displayed correctly.
SapereAude1337SapereAude1337
I got this error when using Lightning Out in a Visualforce Page. My problem was that I accidentally erased the c: in front of the App and Component names. Below is my page. 
<apex:page standardController="Account" sidebar="true">
    <apex:includeLightning />

    <div id="console">
        <div id="lightningComponent" />
    </div>
    
    <script>        
        $Lightning.use("c:PackageManager", function() {

            $Lightning.createComponent("c:PackageBuilder", {
            AccountId : "{!Account.Id}"
            }, "lightningComponent", function(cmp){
                //some stuff if need be
            });
            
        });
    </script>
    
</apex:page>

In my original page, "c:PackageManager" was just "PackageManager" and "c:PackageBuilder" was just "PackageBuilder". My mistake for double-clicking to replace those App/Component names. My guess is the error can come from anything wrong in the markup that causes the App (and probably thew Components, too) to not be able to pull in. 
I hope this helps someone!