Highcharts should be able to find moment
when loaded as a module using import
.
moment
is not saved on window
, so Highcharts fail when trying to access moment
like:
https://github.com/highcharts/highcharts/blob/3c8867e8ead548ada66c38f73fce74b2130dac8b/js/parts/Time.js#L370
https://codesandbox.io/s/7yyz98kv4x
See code and comments in app/app.component.ts
Add API options, like time.moment
that will be settable for a user, so it will be possible to load moment
in above quoted code like:
moment = options.moment || win.moment;
POC: https://codesandbox.io/s/jjr666l539
Set moment
as window.moment
, so Highcharts will be able to find it. E.g. like:
import * as moment from "moment";
window.moment = moment;
Have the same problem, but your suggested work-around does not work for me.
I get the error message at compile:
apps/frontend/src/app/solar-data/cell-power-graph/cell-power-graph.component.ts(8,8): error TS2339: Property 'moment' does not exist on type 'Window'.
It was set the following way:
import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core';
import * as Highcharts from 'highcharts';
import ExportingModule from 'highcharts/modules/exporting';
import * as Moment from 'moment';
import * as mTZ from 'moment-timezone';
window.moment = Moment;
mTZ();
@mfechner
The error will not affect build JavaScript - unless you config prevents builds on TS errors. My solution is just a workaround, so you could ignore this TS error by casting the window
to any
or using any other method to suppress this error.
(window as any).moment = Moment;
or you could extend the Window
interface and add the moment
definition, which is a proper solution for this type of errors.
Thanks a lot for this tip, the following snipit worked fine for me:
import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core';
import * as Highcharts from 'highcharts';
import ExportingModule from 'highcharts/modules/exporting';
import * as Moment from 'moment';
import * as mTZ from 'moment-timezone';
declare global {
interface Window {
moment: any;
}
}
window.moment = Moment;
mTZ();
ExportingModule(Highcharts);
Highcharts.setOptions({
title: {
...
@Component({
...
})
export class CellPowerGraphComponent implements OnInit, OnDestroy {
...
Most helpful comment
Thanks a lot for this tip, the following snipit worked fine for me: