Угловой с контроллером ES6 как странно

Это плохой титул. Я в курсе. Это потому, что я не совсем уверен, как задать этот вопрос. У меня есть два по существу одинаковых класса, которые ведут себя немного по- другому, соответствующий controllerAs: 'vm' в конфигурации состояния для каждого из них также ведет себя по-другому, а недоумение "этот метод может быть статическим" предупреждением от Webstorm в одном из их, а не другого.

index.html:

<div ui-view="main"></div>
<div ui-view="portfolio"></div>

app.js

// this file contains only the module setter with all the
// dependencies, as well as the $stateProvider config and
// any actions that occur when the app runs

'use strict';

angular.module('necApp', ['dep1', 'dep2', 'etc'])

    .config(['$urlRouterProvider', '$locationProvider', '$animateProvider', Config])
    .run(['$rootScope', '$state', Run]);

function Config(params) { /* do stuff */ }
function Run(params) { /* do stuff */ }

main.js

use strict';

import { MainController } from './main.controller';

angular.module('myApp')
    .controller('MainController', MainController)
    .config(['$stateProvider', Config]);

function Config($stateProvider)
{
    $stateProvider

    .state('main',
    {
        url: '/',
        views: {
            'main': {
                templateUrl: 'app/main/main.html',
                // OF NOTE: I have access to the controller as 'vm' in the view
                // regardless of whether I include the next two lines
                controller: MainController,
                controllerAs: 'vm'
            }
        }

    });
}

main.html

<!-- 
     again, this expression is evaluated whether or not I include
     the 'controller' and 'controllerAs' properties in my $state config 
-->
<h1> {{ vm.result }} </h1>

main.controller.js

// OF NOTE: when I DO include the 'controller' property in the $state config
// for the main route, this controller is registered and instantiated twice
'use strict';

export class MainController
{
    constructor($http)
    {
        /* @ngInject */
        angular.extend(this, {
            $http: $http,
            result: ''
        });

        this.Init();
    }

    Init()
    {
        this.$http.get('/endpoint').then(res =>
        {
            this.result = res.data;
        });
    }
}

portfolio.js

use strict';

import { PortfolioController } from './portfolio.controller';

angular.module('necApp')
    .controller('PortfolioController', PortfolioController)
    .config(['$stateProvider', Config]);

function Config($stateProvider)
{
    $stateProvider

    .state('portfolio',
    {
        url: '/portfolio',
        views: {
            'portfolio': {
                templateUrl: 'app/portfolio/views/portfolio.html',
                // OF NOTE: I do NOT have access to the controller as 'vm'
                // in the view in this case without the next two lines
                controller: PortfolioController,
                controllerAs: 'vm'
            }
        }
    });
}

portfolio.html

<!-- this is NOT evaluated without the 'controller' and 'controllerAs' properties in the $state config -->
<h1> {{ someExpression }} </h1>

portfolio.controller.js

'use strict';

export class PortfolioController
{
    constructor()
    {
        angular.extend(this, {

            someExpression: 'Testing . . .'
        });

        this.Init();
    }

    // OF NOTE: Webstorm warns me that this method can be static, even though
    // 1) that breaks it and 2) I do NOT get that warning in MainController
    Init()
    {
        // works as expected
        console.log('initializing PortfolioController.');
    }
}

Как всегда, я очень надеюсь на ваши мысли и комментарии.