1

Previously, I've used Aura's ltng:require to reference a static resource containing multiple js functions**. Here I'm following the d3 example from the docs:

import util from '@salesforce/resourceUrl/util';
import { loadScripts } from 'lightning/platformResourceLoader';

export default class Test extends LightningElement {
  renderedCallback() {
    Promise.all([
      loadScripts(this, util + '/util.js'); // <-- this isn't working and returning undefined
    ])
    .then(() => { //initialize })
    .catch(err => console.log(err))
  }
}

So the issue is that I am not able to load the util functions (excuse the typo earlier about files) despite following the docs for the d3 library - I don't want to create another js file within the component, as I want to use the util library for multiple components. I feel like there would be an easier way to do this.

  • what is the prob you are facing? – salesforce-sas Oct 21 at 17:14
1

It's been done pretty easily before using the d3 library. Check out the docs. This question is a duplicate btw. It has been asked before.

Basically:

import { LightningElement, api, track, wire } from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
import UtilityLWC from 'c/UtilityLWC'; // doesn't work
// import * as util from c/UtilityLWC; // also doesn't work
// import { foo, bar } from c/UtilityLWC; // nope

export default class ConsumerLWC extends NavigationMixin(LightningElement) {

  connectedCallback() {
    // None of these work
    UtilityLWC.foo();
    UtilityLWC.bar();
    // util.foo();
    // util.bar();
    // foo();
    // bar();
  }

}

    import { LightningElement, api } from 'lwc';

export default class UtilityLWC extends LightningElement {

  @api
  foo() {
    console.log('foo from UtilityLWC');
  }

  @api
  bar() {
    console.log('bar from UtilityLWC');
  }

}
  • Hey @sfdc-pup, I looked through these docs but IDK why I get undefined when I follow the docs. The file type is .zip inside the library it is just an object literal with function definitions util = { log: function(){ console.log('hello world'); } } Thanks for the replies. – Luigi Campbell Oct 21 at 18:50
  • i edited my answer. basically this question is a duplicate so i posted the solution some other guy used and i use too. – sfdc-pup Oct 21 at 18:56
  • @sfdc-pup, I noticed in the link to the question provided an entirely different approach. Thanks, at the bottom it says how to use the shared js lwc. I think you posted the question, not the solution but, you are right, it is simple and exactly what I need! – Luigi Campbell Oct 21 at 18:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.