[SalesForce] Salesforce LWC & 3rd Party Library – Should I import the 3rd party library into the package.json anyway

This is specifically focusing on Salesforce specific Lightning Web Components and not Open Source Lightning Web Components. Now I understand the process of uploading the 3rd Party Library as a Static Resource and that the modules can't be imported directly, but I wanted to see if there were any benefits or drawbacks by importing the 3rd party library into the package.json.

The benefit I'm looking to get is that we have security analysis tools currently running over the source code repository, so by including the 3rd party library in the package.json, the security tool can flag any vulnerabilities with the 3rd party library and we can update the static resource.

Are there any other benefits or drawbacks from taking this approach?

Best Answer

It does not hurt to have your libraries in package.json and have package.json stored in your github repository for the project or even in the static resource.

Although as a best practice I recommend you have separate folder in your project where you keep your JavaScript source including third party and then use a bundler like webpack and build a minified Javascript that you store in static resource. (If you are using a continuous integration you can automate all this )

LWC can then only import minified JavaScript and will be faster load because of the size of the script.

Related Solutions

[SalesForce] How to resolve error LWC1513: @salesforce/resourceUrl modules only support default imports

You seem to have incorrect syntax for importing the static resource in the JS. The approach for using 3rd party resource is to upload the static resource and then import it in your JS as below.

Import the Static Resource:

import resourceName from '@salesforce/resourceUrl/resourceName';

And then utilize loadStyle and loadScript to load those resources (JS and CSS) from lightning/platformResourceLoader:

import { loadStyle, loadScript } from 'lightning/platformResourceLoader';

Promise.all([
        loadScript(this, resourceName + '/xxx.js'),
        loadStyle(this, resourceName + '/xxx.css'),
])

Refer to the documentation for more details on the syntax and details.

[SalesForce] Unable to load 3rd party lib in Lightning Web Component

You are passing a path variable in your loadScript call (/fuse.js) which is required when you want to load a file inside an archive When you upload the javascript file directly (which is the case based on your screenshot) you only pass the import identifier as 2nd argument

loadScript(this,fuse)

Best Answer

Related Solutions

[SalesForce] How to resolve error LWC1513: @salesforce/resourceUrl modules only support default imports

[SalesForce] Unable to load 3rd party lib in Lightning Web Component

Related Topic