My configuration is as follows: I'm using this generator:
https://github.com/chrisdwheatley/generator-angular2/
I have angular 2 beta.8, and I use gulp because it's what this generator uses, so I configured it for when I want to build my project, and pick specific files and so on.
I use a config.js file where I map a couple things (and I use it like this: System.config({ ..., and in my package.json I have all my versions: gulp, systemjs, angular2...
So I would like to know HOW to add external javascript libraries (such as this one: http://bl.ocks.org/brattonc/5e5ce9beee483220e2f6
In which we can find the following, as a script in the index:
var gauge1 = loadLiquidFillGauge("fillgauge1", 55);
var config1 = liquidFillGaugeDefaultSettings();
config1.circleColor = "#FF7777";
config1.textColor = "#FF4444";
config1.waveTextColor = "#FFAAAA";
config1.waveColor = "#FFDDDD";
config1.circleThickness = 0.2;
config1.textVertPosition = 0.2;
config1.waveAnimateTime = 1000;
Which I have succesfully used in PLUNKER, and now am unable to reproduce in gulp, local, and deploying the code.
What I have done is to put that code inside a function: my src/ folder:
function bubble() {
var config1 = liquidFillGaugeDefaultSettings();
config1.circleColor = "#FF7777";
config1.textColor = "#FF4444";
...
...
I also have a liquidFillGauge.js file which I took from the same page, linked above, which is untouched.
Then, I want to replicate what I did in plunker, which was the following:
export class MyClass{
constructor() {
bubble();
}
}
So my question would be, how to make a system/config-agnostic configuration to use javascript libraries which you have access to, in angular 2, to integrate with your typescript code
The reason why is that I want to do this a couple times, so I would like a solution that works, in general, for any javascript library and if at all possible, without taking into account having angular-cli, or a certain version, or something else.
I haven't been able to get a result and right now I do not know if it's because of lack of ability or lack of support for this particular action, but here are some things I've tried:
https://stackoverflow.com/a/38032553/6028947
https://stackoverflow.com/a/35046581/6028947
https://stackoverflow.com/a/37348233/6028947
https://stackoverflow.com/a/34985622/6028947
For the record what I mean with "it doesn't work" is that either compiler complains about bubble() being used and not defined previously, or, when I manage to shut it up, it's still wrong since when I deploy, looking at chrome browser console, it shows this or something like this:
ReferenceError: bubble is not defined
at new MyClass... ... ...
