Nodejs with TypeScript gives strange errors

I am using TypeScript 1.5.0 beta and I am using Visual Studio Code to create a simple Node server using the example Anders Hejlsberg showed when building.

///<reference path="typings/node/node.d.ts"/>

import { createServer } from "http"

export function simpleServer(port: number, message: string)
{
  createServer((req, res) =>
  {
    res.writeHead(200, {'Content-Type': 'text/plain'});
    res.end('Hello World\n');
  }).listen(port, '127.0.0.1');

  console.log('Server running at http://127.0.0.1:1337/');
}

      

I have three questions

1) With this code, whenever I try to create a ts file either using Visual Studio Code or using $ tsc server -m commonjs command, it keeps giving weird errors like this

error TS1008: Unexpected token; 'module
, class, interface, enum, import or statement' expected

      

2) It also tries to create the node.d.ts file I link and gives additional expected ":" error messages.

3) This is more of a Visual Studio Code issue. How do we get VS Code to create all ts files in a project / folder and generate js files. I followed the instructions for installing TypeScript for VS Code, but I still have to individually build each ts file to generate the js code.

I know grunting is one way to do it, but as far as I know VS Code should be able to create all ts files in a folder like Visual Studio. Please correct me if I am wrong.

Thank.

+3


source to share


3 answers


Ok, finally I was able to figure out what was going on. Since I installed Visual Studio 2013 and TypeScript 1.4, it created files in C: / Program Files (x86) / Microsft SDK / TypeScript / 1.0. So, every time I use the tsc command, it was always invalid for version 1.0.3.0, which works with TypeScript 1.4, not 1.5.0-beta. When I install TypeScript 1.5.0-beta via node, it created files for the new version in the C: \ Users \ Krishna V \ AppData \ Roaming \ npm \ tsc folder

So, for # 1, to fix the compile version error, I modified the task.json file to use the full path for command and windows parameters. So it will look like

{
    "version": "0.1.0",

    // The command is tsc.
    "command": "C:\\Users\\Krishna^ V\\AppData\\Roaming\\npm\\tsc",

    // Show the output window only if unrecognized errors occur. 
    "showOutput": "silent",

    // Under windows use tsc.exe. This ensures we don't need a shell.
    "windows": {
        "command": "C:\\Users\\Krishna^ V\\AppData\\Roaming\\npm\\tsc"
    },

    // args is the HelloWorld program to compile.
    "args": [],

    "isShellCommand": true,

    // use the standard tsc problem matcher to find compile problems
    // in the output.
    "problemMatcher": "$tsc"
}

      

For # 2, there seems to be issues with writing Node.d.ts out of sync with TypeScript 1.5.0-beta, and there are already similar issues with response.d.ts open in git for this.



For # 3, tsconfig.json only works with TypeScript version 1.5.0-beta, and since tsc was using the wrong version, it never used tsconfig. Now that it is using the correct version, it uses tsconfig and hence builds all the files mentioned in tsconfig. For example any of these (one with ES5 and ES6)

{
    "compilerOptions": {
        "target": "ES5",
        "module": "commonjs",
        "sourceMap": true,
        "removeComments": true
    },
    "files": [
        "server.ts","config.ts","models/user.ts"
    ]
}

OR 

{
    "compilerOptions": {
        "target": "ES6",
        "sourceMap": true,
        "removeComments": true
    },
    "filesGlob": [
        "./**/*.ts"
    ]
}

      

In this case, it will compile the three files mentioned in the first option, or all the ts files in option 2.

+3


source


I can't help you with C # 3 as I haven't tried VS Code yet. However, on # 1 and # 2, you need to do a couple of things:

A.) Include the CommonJS module type in the Typescript compiler. In Visual Studio, you can do this by going to Project -> Properties -> Typescript Build and changing "Modular System" to "CommonJS". On the command line, you do this by passing the "-module commonjs" parameter to tsc.exe. Sorry, I don't know how to achieve this in VS Code.



B.) I think the sample code should look something like this. I'm not sure if Anders may have given a preview of the future syntax at the conference, but the following should work for you:

///<reference path="typings/node/node.d.ts"/>

import Http = require('http')

export function simpleServer(port: number, message: string)
{
    Http.createServer((req, res) =>
    {
        res.writeHead(200, { 'Content-Type': 'text/plain' });
        res.end('Hello World\n');
    }).listen(port, '127.0.0.1');

    console.log('Server running at http://127.0.0.1:1337/');
}

      

0


source


1 - Module error

This will be resolved by going to tsconfig.json # 3 below

2 - Original error with:

The link syntax should be

import http = require('http');

      

3 - Automatically compile ts files to js

  • Customize the tsconfig.json file with your settings
  • (optional) enable autosave feature in Visual Studio Code
  • Setting up a task in Visual Studio Code
  • Use the view function in the TypeScript compiler

Here is tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "noImplicitAny": false,
        "removeComments": true,
        "preserveConstEnums": true,
        "target": "ES5",
        "sourceMap": true,
        "outDir": "../dist"
    }
}

      

Here is the task set .settings / tasks.json --p indicates what you want to compile via tsconfig.json --w indicates that you want to recompile files when saving files You can refer to compiler options here

{
    "version": "0.1.0",
    // The command is tsc.
    "command": "tsc",
    // Show the output window only if unrecognized errors occur. 
    "showOutput": "silent",
    // Under windows use tsc.exe. This ensures we don't need a shell.
    "windows": {
        "command": "tsc.exe"
    },
    // args is the HelloWorld program to compile.
    "args": ["--p", "./PATH-TO-TSCONFIG-FOLDER", "--w"],
    // use the standard tsc problem matcher to find compile problems
    // in the output.
    "problemMatcher": "$tsc"
}

      

Node + TypeScript = Awesome!

0


source







All Articles