Import external CSS and Javascript files in Lightning Aura Component Vs LWC Component

3:54 PM

 This post explains how to import external Javascript and CSS files into a custom lighting component. The first section deals with Aura Component, whereas the later sections explains the same for a LWC component.

STEP 1:

Download the CSS and JS files. Upload them as a static resource. For this example, let's pick bootstrap. Get bootstrap v4.5 from https://getbootstrap.com/docs/4.5/getting-started/download/ and click the first download button.

Upload the ZIP file as a Static Resource with name 'bootstrap'.

In the meanwhile, let's look at the structure of the zip file on your local machine. This would come in handy when referring the files in your component.

Download Jquery from https://jquery.com/download/ and upload the file as a Static resource with name 'jquery'

STEP 2:

Aura Component

 

Refer the CSS files and JS files in the Aura Component.


STEP 2:

LWC Component

Refer the CSS and JS files in LWC Component.


0 comments