Nieoczekiwany token przy błędzie @ w module Aurelia

Question

Po uruchomieniu aplikacji Aurelia pojawia się następujący błąd w Chrome. Otrzymuję błąd wszędzie tam, gdzie mam @. Na przykład @customElement i @bindable podaje błąd.

Moi config.js wygląda jak poniżej:

System.config({ 
    "baseURL": "/", 
    "transpiler": "babel", 
    "babelOptions": { 
    "optional": [ 
     "runtime" 
    ] 
    }, 
    "paths": { 
    "*": "*.js", 
    "github:*": "jspm_packages/github/*.js", 
    "npm:*": "jspm_packages/npm/*.js" 
    } 
}); 

Answer 1

@customElement i @bindable nazywane są decorators który jest funkcja eksperymentalna w JavaScript ES7, więc to nie jest obecnie obsługiwany przez przeglądarkę.

Jednak babel można również transpile tę funkcję z powrotem do ES5 który następnie może być wykonywane przez popularnych przeglądarek

Wystarczy skonfigurować tę funkcję w babel z użyciem es7.decoratorsoption:

"babelOptions": { 
    "optional": [ 
     "es7.decorators", 
     "runtime" 
    ] 
    }, 

Zawsze możesz sprawdzić Aurelia navigation skeleton jako odniesienie dla config.js lub innych opcji konfiguracji.