current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Join the Stack Overflow Community
Stack Overflow is a community of 6.2 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up
up vote 5 down vote favorite
2

Say I have a foo.ts and app.ts as follows:

foo.ts:

 export interface Foo {
     id: number; 
     label: string;
 };

app.ts:

 import {Foo} from './foo'
 var myfoo: Foo = { "id": 1, "label": "One" };
 console.log(JSON.stringify(myfoo));

After compiling, executing 'node app.js' from the command line runs as expected if I use "module"="commonjs" in my tsconfig.json. Cutting to the chase, what I would like to do is is use my Foo interface client-side with Angular 2, and server-side with node. Inconveniently, the Angular 2 quickstart I am modeling on here wants "module"="system" in tsconfig.json. This configuration causes an error when trying to run 'node app.js':

System.register([], function(exports_1) {
^
ReferenceError: System is not defined`

I have tried following the instructions for using systemjs with node on github, but at this point I am just mashing keys and could use some help. How do I either (a) get my app.ts code running on the server-side using systemjs, or alternately, (b) get the Angular 2 quickstart running with commonjs?

share|improve this question
    
Are you sure you included "system.js" in your html ? Check your dev tools to be sure that all javascript files are loaded. – Fabien Sa Dec 21 '15 at 16:36
    
This is node.js on the server side, run from the command line. The client runs fine with the system.js and the Angular 2 quickstart tutorial. Except instead using lite-server like in the tutorial, I am using Node (+Express) to serve up the pages (+web services). But I can't get "system" to work on the server typescript code that wants to share interface Foo. What I am looking for is a simple typescript server-side node example that uses "system" instead of "commonjs". – Ken Dec 21 '15 at 21:54
    
To be clear, everything works fine if I write the server side in ES5 and traditional javascript. But I am hitting a wall trying to share typescript code on both the client and the server, with tsc -p . on the whole client&server project. – Ken Dec 21 '15 at 22:02
    
What I do is using gulp with to convert ts to js (with CommonJS), tsd (tsd install node express) for the "typings" and then running node. It's hard to see your problem without all the code. – Fabien Sa Dec 22 '15 at 21:31
    
The problem is the two module loading targets (system vs commonjs). And yes the solution appears to be to use different targets for the server and the client, managed with Gulp. What I was hoping was for a way to use system on the server code launched from the command line, as well as for the client, as in the Angular 2 quickstart tutorial. That way I can just have tsc -p on the whole project. All the code is in the OP. But it appears either that isn't possible, or no one cares because everyone uses Gulp. – Ken Dec 22 '15 at 23:06
up vote 2 down vote

I am going to wrap this up with an answer, even if the question hasn't been up-voted. The solution appears to be to use Gulp to compile the common typescript code (like interface Foo) differently for the client ("module"="system") and the server ("module"="commonjs"). If there is a way to compile the typescript code in the OP with "module"="system" I'd still like to know. But it appears to be kind of academic since everyone manages their project with Gulp or something similar anyway.

share|improve this answer
    
I use the same approach currently. But the downside is, that editors like visual studio mark dozens of errors with this approach. – Andi Giga Jul 6 at 7:09

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.