Example does not work / "Cannot find module 'angular2-redux-store'"

[SeriousM]

Hi!
I read your post about angular2, redux, immutable and I was keen to try it out!
I tried to reference the angular2-redux-store as you've wrote in the readme, but typescript is constantly telling me, that it's unable to find the module, even it exists in the node_modules folder.

I thought I will try your example, because that one has to work, right? Nope, sorry, it doesn't.

Thats the output after starting the example as documented in your readme:

> [email protected] watch D:\github\angular2-redux-store\example
> rm -rf build && mkdir build && tsc -p src -w

src/App.ts(47,27): error TS2339: Property 'dispatch' does not exist on type 'TodoStore'.
src/App.ts(52,15): error TS2339: Property 'subscribe' does not exist on type 'TodoStore'.
src/App.ts(60,20): error TS2339: Property 'dispatch' does not exist on type 'TodoStore'.
src/App.ts(65,32): error TS2339: Property 'dispatch' does not exist on type 'TodoStore'.
src/App.ts(66,32): error TS2339: Property 'dispatch' does not exist on type 'TodoStore'.
src/App.ts(69,32): error TS2339: Property 'dispatch' does not exist on type 'TodoStore'.
src/TodoList.ts(41,20): error TS2339: Property 'dispatch' does not exist on type 'TodoStore'.
src/TodoList.ts(51,20): error TS2339: Property 'dispatch' does not exist on type 'TodoStore'.
src/TodoService.ts(25,16): error TS2322: Type 'Observable<Response>' is not assignable to type 'Observable<List<Todo>>'.
  Type 'Response' is not assignable to type 'List<Todo>'.
    Property 'set' is missing in type 'Response'.
src/store/TodoStore.ts(3,44): error TS2307: Cannot find module 'redux'.
src/store/TodoStore.ts(6,26): error TS2307: Cannot find module 'redux-logger'.
src/store/TodoStore.ts(7,26): error TS2307: Cannot find module 'angular2-redux-store'.
src/store/todoReducers.ts(5,31): error TS2307: Cannot find module 'redux'.
2:08:26 PM - Compilation complete. Watching for file changes.

I'm using windows 10 with a cygwin shell.

Do you know what's the problem is?

Thank you,
Bernhard

[SeriousM]

Hi jhades, it would be very polite if you could at least tell me, that you don't have time to help me out.
I really want to use your library but I don't know where the problem is.

Thnak you,.

[alexanderharm]

Did you actually try running it in the browser? I personally am not too worried about these tsc errors.

[SeriousM]

The files aren't compiled by the tsc because of the errors, so I can't run it in the browser. But you're right, the target platform should be the browser.

[alexanderharm]

I too get these errors but typescript will compile anyways. For me it works. So your example/build directory remains empty?

[alexanderharm]

As the documentation says: Just open a second console, goto your example directory, type npm start and open http://localhost:8080 in your browser.

[SeriousM]

Well, it does work, but to be honest, an error is something that's alerting...
I'll try to fix the problem and send a PR then.
Thanks for the help so far!

[alexanderharm]

Well, the TypeScript transpiler emits all sort of semantic errors. I personally have given up trying to solve them in my projects. As soon as you have an external library without proper definition file… you are in hell :-)

On 8. Feb. 2016, at 12:10, Bernhard Millauer [email protected] wrote:

Well, it does work, but to be honest, an error is something that's alerting...
I'll try to fix the problem and send a PR then.
Thanks for the help so far!

—
Reply to this email directly or view it on GitHub #2 (comment).

[SeriousM]

we resolved the issue... the typescript compiler (tsc) is searching for the modules like node - searching in "node_modules" folders. @jhades is using jspm which violates that search pattern and therefore typescript is fucking around :) but systemjs is playing nice because of the config in the config.js file. Yep, it's hard to satisfy typescript for the analysis and the module-system after the transpilation -.- ...

[alexanderharm]

How exactly did you resolve it?

On 8. Feb. 2016, at 13:44, Bernhard Millauer [email protected] wrote:

Closed #2 #2.

—
Reply to this email directly or view it on GitHub #2 (comment).

[SeriousM]

By not using jspm.
The problem is that tsc does not know anything about jspm, it only knows how to resolve node modules like this and that. By using jspm you hide the node modules from tsc and then you get the errors.

Thats my .tsconfig, systemjs config, and the usage of the redux which works fine now.

[alexanderharm]

Or simply using both… I recently tried JSPM and I think it is great!

On 8. Feb. 2016, at 17:32, Bernhard Millauer [email protected] wrote:

By not using jspm.
The problem is that tsc does not know anything about jspm, it only knows how to resolve node modules like this microsoft/TypeScript#2338 and that https://nodejs.org/api/modules.html#modules_all_together. By using jspm you hide the node modules from tsc and then you get the errors.

Thats my .tsconfig https://github.com/SeriousM/BugTracker/blob/ea18550b7ce2b4bde20a4a7d04725589616e863e/BugTracker.App/tsconfig.json, systemjs config https://github.com/SeriousM/BugTracker/blob/ea18550b7ce2b4bde20a4a7d04725589616e863e/BugTracker.App/Static/app/system.test.js, and the usage of the redux https://github.com/SeriousM/BugTracker/blob/ea18550b7ce2b4bde20a4a7d04725589616e863e/BugTracker.App/Static/app/stores/userStore.ts which works fine now.

—
Reply to this email directly or view it on GitHub #2 (comment).

[SeriousM]

And how does typescript plays together with jspm?

[alexanderharm]

According to this post it should work if you are adding the npm and jspm packages: http://www.mario-brendel.com/angular2-setup/2016/01/28/Angular2_Jspm_Setup_Part1/ http://www.mario-brendel.com/angular2-setup/2016/01/28/Angular2_Jspm_Setup_Part1/

However, I’m using VS Code and I get loads of highlighting errors etc. They wait for JSPM to become more stable to add support in tsc: microsoft/TypeScript#6012 microsoft/TypeScript#6012

One piece of advice: when using angular2-redux-store make sure you fix the implementation!!! The dispatch and the subscribe methods need to RETURN the native store methods. Otherwise you will be in hell with async actions and you cannot unsubscribe onDestroy.

On 8. Feb. 2016, at 22:38, Bernhard Millauer [email protected] wrote:

And how does typescript plays together with jspm?
—
Reply to this email directly or view it on GitHub #2 (comment).

[jhades]

fixed, added the returns in 1.2.0 available in npm.

[SeriousM]

According to this post it should work if you are adding the npm and jspm packages

Obvious, because systemjs does the resolving of the required files but that does not solve the typescript-errors problem.

They wait for JSPM to become more stable to add support in tsc

Thats great news, but until then I'll stay with systemjs and plain node :)

fixed, added the returns in 1.2.0 available in npm.

Great, thank you!! :)
Just noticed yesterday that subscribe does not return anything which was wrong