Usage in a TypeScript project

[vogloblinsky]

I am in an Angular project coded in TypeScript.

import { Spritz } from 'spritz.js';

Simple loading spritz.js using ES6 syntax, and i got this error :

WARNING in ./src/app/views/game/game.component.ts
16:25-31 "export 'Spritz' was not found in 'spritz.js'

[vogloblinsky]

Fixed using this syntax, not very nice...

const SpritzModule = require('spritz.js'),
      Spritz = SpritzModule.default;

[maoosi]

What about import Spritz from 'spritz.js'; instead of import { Spritz } from 'spritz.js'; ?

[vogloblinsky]

import Spritz from 'spritz.js';

breaks too

ERROR in /Volumes/Data/wamp/SII/RetD/coding-game/coding-game-frontend/src/app/views/game/game.component.ts (3,20): Cannot find module 'spritz.js'.)
webpack: Failed to compile.

[maoosi]

One last thing that you could potentially try is:

import Spritz from 'spritz.js/dist/spritz.module.js'

Please let me know what the output is.

[vogloblinsky]

ERROR in /home/SII/vogloblinsky/Documents/www/RetD/coding-game/coding-game-frontend/src/app/views/game/game.component.ts (3,20): Cannot find module 'spritz.js/dist/spritz.module.js'.)
webpack: Failed to compile.

[maoosi]

After having a little digging, the issue seems related with the way Typescript deals with modules import: microsoft/TypeScript#2719

I'm not sure if the problem really is with Typescript itself, or the tool I use to bundle the library (rollup). I don't personally use Typescript, but according the link above, one other way to write the fix you've found is:

import {default as Spritz} from "spritz.js";

[vogloblinsky]

Nice, it works !
Thanks

[vogloblinsky]

Spoken too quickly.
Always same error :

ERROR in /home/SII/vogloblinsky/Documents/www/RetD/coding-game/coding-game-frontend/src/app/views/game/game.component.ts (3,20): Cannot find module 'spritz.js/dist/spritz.module.js'.)
webpack: Failed to compile.