Aurelia Beta and the Unexpected Token

Aurelia hit beta on November 16th. The team kicked off the beta the following five days of blog post.

Day 1 – The Beta is Here!
Day 2 – Plugins
Day 3 – Documentation
Day 4 – Ecosystem
Day 5 – Aurelia Interface

ASP.NET 5 hit release candidate 1 two days after Aurelia hit beta and writing the migration from beta 8 to rc1 was my priority and then I took Thanksgiving week off. To get back in the swing of things I rebuild my contacts application with ASP.NET RC1.

After getting the ASP.NET parts done and moved on to rebuilding the Aurelia portions. Using my original blog on getting started with Aurelia and the new Aurelia getting started guide I got everything installed.

As you may have guessed it was a no go. I kept getting an unexpected token on @inject on any view model that was using dependency injection. I did a lot of comparing the working version to the non-working version but the files were identical.

After a quick google I found the answer on stack overflow. The problem was the babel options which can be found in config.js in the wwwroot folder. Here is the section in question from my pre-beta application.

babelOptions: {
  "optional": [
    "runtime",
    "optimisation.modules.system"
  ],
  "stage": 0
}

And the new version.

babelOptions: {
  "optional": [
    "runtime",
    "optimisation.modules.system"
  ]
}

As Jeremy Danyow points out in the above stack overflow answer either es7.decorators needs added to the optional section or to set the stage option to 0. I ended up with the following based on the new samples from the Aurelia team, which also matches the answer from Jeremy.

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

 

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.