You might need third-party libraries for your business.
Procedure
-
Extend the screen in which you want to use the third-party libraries. For instructions on how to extend the screen, see Modifying application-provided screens.
-
Go to the <store-temp>/extensions/features/<featureName>/src/assets folder and create the <featureName>/scripts subfolder.
-
Copy the third-party scripts in the <store-temp>/extensions/features/<featureName>/src/assets/<featureName>/scripts folder.
-
Modify the component.ts file of the angular component where you want to use the third-party libraries and add the following sample code in the constructor.
constructor(
) {
const dynamicScripts = [
{'scriptPath': AppInfoUtil.getWARModeExtensionAssetBaseUrl() + '/assets/ /scripts/custom-lib-min.js','id': 'customScipt'}];
for (let i = 0; i < dynamicScripts.length; i++) {
if (document.getElementById(dynamicScripts[i].id) === null) {
const node = document.createElement('script');
node.src = dynamicScripts[i].scriptPath;
node.type = 'text/javascript';
node.async = false;
node.charset = 'utf-8';
document.getElementsByTagName('head')[0].appendChild(node);
}
}
}
- Alternative method
- If the given procedure does not work for your business case, try the following alternative procedure.
- Install the third-party library of your choice directly as an npm package, by using the following command in your project directory.
- Replace the value of <library-name> with the name of the library that you want to add.
npm install <library-name>
