I have two almost identical Lightning Web Components with only difference that they use two different Apex Controller with two different Apex method to get data, the first component uses version with three parameters and the other component uses version with five parameters. I would like to follow the DRY principle (Don't Repeat Yourself) and to remove duplicate code for sorting datatable but I can't. [Documentation][1] sounds very unclear how to implement that. Listing of `a.html` <template> <template if:true={error}> <template if:true={error.body}> {error.body.message} </template> </template> <lightning-datatable data={data} columns={columns} key-field="id" hide-checkbox-column onsort={updateColumnSorting}></lightning-datatable> </template> Listing of `a.js` import { LightningElement, track, api } from 'lwc'; import getColumnsAndData from '@salesforce/apex/ACont.getColumnsAndData'; export default class SimpleDataTableLWC extends LightningElement { @api a; @api b; @api c; @track data; @track columns; @track error; //@track sortedBy; //@track sortDirection; connectedCallback() { getColumnsAndData({a:this.a, b:this.b.split(','), c: this.c }).then(result=>{ this.data = result.data; this.columns = result.columns; }).catch(error => { this.error = error; }); } // Client-side controller called by the onsort event handler updateColumnSorting(e) { //this.sortedBy = e.detail.fieldName; //this.sortDirection = e.detail.sortDirection; e.srcElement.sortedBy = e.detail.fieldName; e.srcElement.sortDirection = e.detail.sortDirection; this.sortData(e.detail.fieldName, e.detail.sortDirection); } sortData(fieldName, sortDirection) { var reverse = sortDirection !== 'asc'; //sorts the rows based on the column header that's clicked var data = this.data; var primer = (data && data.length && data[0].Origin) ? (x, field)=>x.Origin[field] : null; data.sort(this.sortBy(fieldName, reverse, primer)) this.data = JSON.parse(JSON.stringify(data)) ; } sortBy(field, reverse, primer) { var key = primer ? function(x) {return primer(x,field)} : function(x) {return x[field]}; //checks if the two rows should switch places reverse = !reverse ? 1 : -1; return function (a, b) { a = key(a); b = key(b); return reverse * ((a > b) - (b > a)); } } } Listing of `b.html` <template> <template if:true={error}> <template if:true={error.body}> {error.body.message} </template> </template> <lightning-datatable data={data} columns={columns} key-field="id" hide-checkbox-column onsort={updateColumnSorting}></lightning-datatable> </template> Listing of `b.js` import { LightningElement, track, api } from 'lwc'; import getColumnsAndData from '@salesforce/apex/BCont.getColumnsAndData'; import {updateColumnSorting} from 'c/a'; import a from 'c/a'; export default class DataTableLWC extends LightningElement { @api a; @api b; @api c; @api d; @api e; @track data; @track columns; @track error; //@track sortedBy; //@track sortDirection; connectedCallback() { getColumnsAndData({ a:this.a, b:this.b.split(',') , c: this.c, d: JSON.parse(this.d.replace(/'/g, '"')) , e: JSON.parse(this.e.replace(/'/g, '"')) }) .then(result=>{ this.data = result.data; this.columns = result.columns; }).catch(error => { this.error = error; }); } updateColumnSorting(e) { updateColumnSorting(e); a.updateColumnSorting(e); } /*// Client-side controller called by the onsort event handler updateColumnSorting(e) { //this.sortedBy = e.detail.fieldName; //this.sortDirection = e.detail.sortDirection; e.srcElement.sortedBy = e.detail.fieldName; e.srcElement.sortDirection = e.detail.sortDirection; this.sortData(e.detail.fieldName, e.detail.sortDirection); } sortData(fieldName, sortDirection) { var reverse = sortDirection !== 'asc'; //sorts the rows based on the column header that's clicked var data = this.data; data.sort(this.sortBy(fieldName, reverse)); this.data = JSON.parse(JSON.stringify(data)) ; } sortBy(field, reverse, primer) { var key = primer ? function(x) {return primer(x[field])} : function(x) {return x[field]}; //checks if the two rows should switch places reverse = !reverse ? 1 : -1; return function (a, b) { a = key(a); b = key(b); return reverse * ((a > b) - (b > a)); } }*/ } I would like to remove commented code from `B.js` and reuse the same method from `A.js`. However, both when I try to use import {updateColumnSorting} from 'c/a'; and updateColumnSorting(e); and when I try to use import a from 'c/a'; and a.updateColumnSorting(e); I receive an error > Uncaught TypeError: a.updateColumnSorting is not a function throws at > /auraFW/javascript/pxtF0ZdGYF-z00XsmRUcGQ/aura_proddebug.js:6146:17 I even tried to add line export * from a; to the end of a.js file but it didn't compile. How do I reuse Javascript code from one LWC in another LWC? [1]: https://developer.salesforce.com/docs/component-library/documentation/lwc/lwc.create_javascript_share_code