Route Config "as" or "name" property

[Dyljyn]

When using the DevServer of Webpack with a setup RouteConfig, I'm getting an error about both "as" and "name" property being set of a RouteDefinition, which I haven't.

webpack.config.js has not been changed from the default.

Code of normalizeRouteConfig: where the error comes from

if (config.as && config.name) {
    throw new exceptions_1.BaseException("Route config should contain exactly one \"as\" or \"name\" property.");
}

Component with RouteConfig

import {Component, View, Injectable} from 'angular2/core';
import {RouterOutlet, RouteConfig} from 'angular2/router';

import {App} from './app';
import {Test} from "./test";

@Component({
    selector: 'boot-auth',
})
@View({
    directives: [RouterOutlet],
    template: `
            <router-outlet></router-outlet>
    `
})
@RouteConfig([
    { path: ':at/...', component: App, as: 'App', name: null },
    { path: '/test', component: Test, as: 'Test', name: null }
])
export class BootAuth {}

Basic component

import {Component, View} from 'angular2/core';

@Component({
    selector: 'test'
})
@View({
    template: `
        Hello, this is test
    `
})
export class Test {
    constructor() {
        console.log('Test init');
    }
}

Anyone any idea how to fix this error?

[ericmartinezr]

The fix is really easy. As the error stated you should provide either as _OR_ name, not both. Consider too that as has been deprecated long ago, so you should use name

[Dyljyn]

I tried with both cases, the name: null was to try having it as false. Didn't know 'as' has been deprecated though.

Just found out that using 'name' does indeed work, I forgot to put a # in the url http://localhost:3000/#/test.
Quick question: is there a way to not have to use the '#' with the devServer?

Thanks for your help.

[Dyljyn]

Never mind the question: The answer was that default with webpack the HashLocationStrategy is used, changed to PathLocationStrategy to get the correct result.

bootstrap(BootAuth, [
    ...ENV_PROVIDERS,
    ...HTTP_PROVIDERS,
    ...ROUTER_PROVIDERS,
    provide(LocationStrategy, {useClass: PathLocationStrategy})
])