Visual Studio thinks there is a Syntax Error, but there isn't

Question

I am building a website using Aurelia within Visual Studio, it has the babel transpiler and my config file looks as follows

babelOptions: {
        "optional": [
              "optimisation.modules.system",
    "es7.decorators",
    "es7.classProperties",
    "es7.asyncFunctions",
    "runtime"
        ]
    },

Visual Studio is reporting an error. Expected ';' on line 4. However this seems to be the correct syntax, the app.js works, and I can browse to the app.html without any issues in the console. Here is the offending code.

export class App {
    message = "Hello Aurelia";

    configureRouter(config, router) { /// <--- Expected ';'
        this.router = router;
        config.title = 'Aurelia';
        config.map([
          { route: ['', 'home'],       name: 'home',       moduleId: 'home/index' },
        ]);
    };
};

If i try to use the more standard javascript lines

let configureRouter = function(config, router) {};

or

this.configureRouter = function(config, router) {};

Visual studio reports no issue, but Aurelia throws Error: (SystemJS) http://localhost:57366/src/app.js: Unexpected token (4:8) in the console for both above.

Any idea how to get Visual Studio to be using the same intellisense as the babel transpiler is using? Or what the issue could be?

charles-isaac cote · Answer 1 · 2016-10-09T02:23:35.800

0

I am no expert of Aurelia but I know that sometimes Visual Studio tells you that there is an error at the line X while the real error is further down in the code.

I think there is a ',' that should not be there a the end of line 8:

config.map([
      { route: ['', 'home'],       name: 'home',       moduleId: 'home/index' },
]);

shoud probably looks like:

config.map([
      { route: ['', 'home'],       name: 'home',       moduleId: 'home/index' }
]);

Visual Studio thinks this:

Foo({ "bar",
      "bar",
      "bar",
      "bar",
      });

is only a single line.

edited Oct 09 '16 at 02:23

answered Oct 09 '16 at 02:13

charles-isaac cote

33
1
6

not quite. it should be without the comma. `config.map([ { route: ['', 'home'], name: 'home', moduleId: 'home/index' }` That still wasn't it, Visual Studio still gives me an error. – christopher clark Oct 09 '16 at 02:18
The code you posted with ';' doesnt work. dont forget that `config.map([` starts an array of objects. There are additional syntax errors with your way. – christopher clark Oct 09 '16 at 02:20
Yeah, I just saw it made no sense, I was editing it when you posted your comment. Thanks. – charles-isaac cote Oct 09 '16 at 02:24

score 0 · Answer 2 · answered Oct 09 '16 at 02:14

This is more of a work around than an answer. It looks like Visual Studio does not support the module piece of es6. Rather than hunting down the configuration file for Visual Studio, or using a third party tool/extension, the below solution will work.

Defining the export at the end of the file instead will work.

class App {
    message = "Hello Aurelia";
    villy = "lawrence";

    configureRouter(config, router) {
        this.router = router;
        config.title = 'Aurelia';
        config.map([
          { route: ['', 'home'],       name: 'home',       moduleId: 'home/index' },
        ]);
    };
}

export { App };

Visual Studio thinks there is a Syntax Error, but there isn't

2 Answers2