Clever Geek Handbook

"Unexpected token export" in Angular app with SystemJS and TypeScript

Problem: mysterious "Unexpected token export"

I was able to get this error in an Angular example running in a plunker where SystemJS translates TypeScript code to the browser.

There was nothing wrong with the code that worked fine locally .

+3


source to share


1 answer


Decision

This is not an Angular problem. This is a problem with forwarding certain types of TypeScript files in the browser.

In my case, I traced the issue down to one file that only exported the abstract class .

// Class used as a "narrowing" interface that exposes a minimal logger
// Other members of the actual implementation are invisible
export abstract class MinimalLogger {
  logs: string[];
  logInfo: (msg: string) => void;
}

The problem is that this file doesn't export anything other than an abstract class.

When I add an inert export of anything specific ... like this:

export const _ = 0; // hack: must export something "real"


... the error disappears.

I've seen a similar issue with a file that only exports TypeScript interfaces. You must give him at least one thing that is "real".

Wednesday:

  • typescript @ 2.2.1
  • systemjs@0.19.39

SystemJS Config for this example:

 System.config({
    // DEMO ONLY! REAL CODE SHOULD NOT TRANSPILE IN THE BROWSER
    transpiler: 'ts',
    typescriptOptions: {
      "target": "es5",
      "module": "commonjs",
      "moduleResolution": "node",
      "sourceMap": true,
      "emitDecoratorMetadata": true,
      "experimentalDecorators": true,
      "lib": ["es2015", "dom"],
      "noImplicitAny": true,
      "suppressImplicitAnyIndexErrors": true
    },
    meta: {
      'typescript': {
        "exports": "ts"
      }
    },
    ...
  })
+3


source






More articles:


All Articles