I have an Angular2 project where i need to import a javascript file for use in my typescript.
I have a javascript file in app/js/d3gantt.js which contains a single function of gantt = function()
.
gantt = function() {
//Does lots of stuff
return gantt;
};
I then have a definition file called d3gannt.d.ts in the same folder which looks like this:
declare module 'd3Gantt' {
export module d3Gantt {
export function gantt(): any;
}
}
And then i reference it in my component as
import * as d3Gantt from '../app/js/d3gantt';
However, i get the error message stating File 'c:/Projects/RepackLog/RepackLog/RepackLog/app/js/d3gantt.d.ts' is not a module
Am i missing something that is needed for this to pick up my files properly?
Thanks,
A module can be created using the keyword export and a module can be used in another module using the keyword import . In TypeScript, files containing a top-level export or import are considered modules. For example, we can make the above files as modules as below. console.
In TypeScript, just as in ECMAScript 2015, any file containing a top-level import or export is considered a module. Conversely, a file without any top-level import or export declarations is treated as a script whose contents are available in the global scope (and therefore to modules as well).
We cannot use TypeScript modules directly in our application. We need to use the JavaScript for TypeScript modules. To get the JavaScript files for the TypeScript modules, we need to compile modules using TypeScript compiler.
As @FabioAntunes mentioned in one of the comments above, you just have to export gantt
on your d3gantt.js file itself, in-line.
The exact syntax would be
export gantt = function() {
//Does lots of stuff
return gantt;
};
No need to declare it anywhere else. For further note on exporting modules please refer this post (Typescript es6 import module "File is not a module error").
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With