Activity Forums Salesforce® Discussions Can we include external JavaScript/CSS libraries like jQuery, bootstrap in compo

  • Can we include external JavaScript/CSS libraries like jQuery, bootstrap in compo

    Posted by Pooja on July 21, 2020 at 7:26 pm

    Can we include external JavaScript/CSS libraries like jQuery, bootstrap in components in Salesforce?

    MOHIT replied 4 years, 4 months ago 2 Members · 1 Reply
  • 1 Reply
  • MOHIT

    Member
    July 22, 2020 at 5:37 am

    Yes, we can include external JavaScript/CSS libraries in salesforce lightning components.
    Lightning Components framework provides a great way to easily decompose applications into components. But building applications also depend on tons of other OSS libraries like JQuery, Twitter Bootstrap, Moment.js and more to implement various features.
    While loading 3rd party libraries is trivial, loading them into a trusted enterprise environment like Salesforce needs to meet our strict security needs. They also need to meet various application needs such as loading multiples files in a specific order. So with Spring ‘15 release we created a new component called ltng:require to load libraries while being secure. It has the following features:
    Asynchronously load multiple CSS and/or JS libraries
    Load libraries in any dependency order the app needs
    Let the app know when loading all JS libraries are complete
    Most importantly, load only verifiable libraries (for security purposes)
    Let’s take at the syntax to better understand it:
    1
    <ltng:require
    2
    styles="/resource/path/to/css1[,/resource/path/to/css2]"
    3
    scripts='/resource//path/to/js1.js,[/resource//path/to/js2.js]'
    4
    afterScriptsLoaded="{!c.controllerFunction}"
    5
    />
    styles – Allows us to specify multiple CSS files separated by comma. They will be loaded from left-to-right.
    scripts – Allows us to specify multiple JS files separated by comma. Again they will be loaded from left-to-right
    afterScriptsLoaded – Allows us to provide a JS function to notify when all JS files are loaded.
    Notes:
    Files paths must always start from /resource. i.e they must be a static resource to enforce security.
    CDNs are not allowed at this point because they are outside of Salesforce data centers and can’t be controlled. In the future, we may allow admins to whitelist CDNs for their orgs.
    If you upload a JS or CSS directly into Static resource, then you should reference them by resource name without .css or .js suffix. For example: /resource/myjsfile or /resource/mycssfile
    If your resource is inside a zip file, then you should use .css or .js suffix. For example: /resource/<resourcename>/path/to/myjsfile.js

Log In to reply.

Popular Salesforce Blogs

Popular Salesforce Videos