cancel
Showing results for 
Search instead for 
Did you mean: 
Reply

Issue Using external javascript files

Hey guys, I am facing an issue in using external js file, before updating to latest CLI version we where making js file for the external library and importing it by declaring it in ControlManifest, But as Library tag support is removed now, I am facing issue in how to use that javascript file in index.ts.

1 ACCEPTED SOLUTION

Accepted Solutions
DianaBirkelbach
Level: Powered On

Re: Issue Using external javascript files

Have you tried using

import "./pathTo/YourFile.js";

on the top of your index.ts?

View solution in original post

8 REPLIES 8
DianaBirkelbach
Level: Powered On

Re: Issue Using external javascript files

Have you tried using

import "./pathTo/YourFile.js";

on the top of your index.ts?

View solution in original post

PowerApps Staff HemantG
PowerApps Staff

Re: Issue Using external javascript files

There are two main steps required to use the external librarires. PLease refer to  Angular Flip component and React Facepile component for working samples.

 

1. Include the externl library as dependecy in the packahe.json 

  "dependencies": {
    "@types/node": "^10.12.18",
    "@types/powerapps-component-framework": "1.1.0",
    "angular": "^1.7.8",
    "angular-animate": "^1.7.8",
    "angular-sanitize": "^1.5.5",
    "angular-ui-bootstrap": "^1.3.3",
    "@types/angular": "^1.6.54",
    "@types/angular-ui-bootstrap": "~0.13.47"
  }

 

2. Import the library in the main index.ts file

 

import * as angular from "angular";

hemant 

Re: Issue Using external javascript files

Thanks alot

Re: Issue Using external javascript files

Thank you @HemantG and @DianaBirkelbach 

 

@DianaBirkelbach: We are able to add external JavaScript files using import statement, but the control is giving an error in internet explorer.

 

@HemantG: We are able to add external JavaScript files (jQuery/Angular) into latest PCF control(Updated CLI), but we also have some JavaScript files(Some generic logic implemented in this files/ Bing Maps API URL) created on our own that we want to add into PCF control. Could you please guide us on how to add dependencies for JavaScript’s files which are created by us.

 

DianaBirkelbach
Level: Powered On

Re: Issue Using external javascript files

@sheldoncopper73  As far as I could evaluate, the files imported as import 'yourfile.js' are not transpiled to ES5, so in Internet Explorer will only work if it uses ES5 already or if you transpile the file by yourself, before adding it to project.

import {getProposals} from "./data/Requests"; //this will be transpiled
import "./Core/Dummy.js"; //this is not transpiled

Of course the better way is to import functions or objects, not a file, but maybe that's not allways possible.

Hope it helps Smiley Wink

alchin
Level: Powered On

Re: Issue Using external javascript files

Technically, pcf-scripts under the hood leverages webpack and babel-loader so that javascript files included in your bundle are transpiled.  However, the current settings are defined to target browsers that support ES modules.  Internet Explorer is not explicitly listed as a target and may be why your JS files are not running correctly.

DianaBirkelbach
Level: Powered On

Re: Issue Using external javascript files

@alchin  It's not that we love IE, but since Dynamics 365 still supports IE11, our PCF Controls have to support them too. Do you mean that the PCF controls are generally not supported in IE? That could be a big issue. Or maybe you mean that settings will be changed in a future version?

Or maybe Dynamics 365 won't support IE anymore Smiley Wink, that would be of course the best ?

 

alchin
Level: Powered On

Re: Issue Using external javascript files

Hi Diana,

 

Controls that are built using the tooling should be able to support IE.  If that is not the case, then our team will need to evaluate where the gaps are and fix them.  This may be one such area.

 

Thank you,

a/c

Helpful resources

Announcements
thirdimage

Power Automate Community User Group Member Badge

Fill out a quick form to claim your user group badge now!

sixthImage

Power Platform World Tour

Find out where you can attend!

Power Platform 2019 release wave 2 plan

Power Platform 2019 release wave 2 plan

Features releasing from October 2019 through March 2020

fifthimage

Microsoft Learn

Learn how to build the business apps that you need.

Top Kudoed Authors (Last 30 Days)
Users online (5,239)