ESlint fails on compiling es6 import/export statements

3
votes

I'm trying to convert my existing angular app to es6 using classes. But the eslint is failing in compiling my js files when it encounters the import/export statement.

class HeaderController {

    constructor($rootScope, $scope) {
        this.$rootScope = $rootScope;
        this.$scope = $scope;
    }

    changeNavItem(selectedTab) {
        this.activeNavItem = selectedTab;
    }

    init() {
        this.activeNavItem = 'All';
    } }

HeaderController.$inject = ['$rootScope', '$scope'];

angular.module('app')
    .controller('HeaderController', HeaderController);

export default HeaderController; // fails on this line

ESlint throws this error 'couldn't process source due to parse error 'import' and 'export' may appear only with 'sourceType: module''

I have added the necessary config for ESlint, but still it fails.

I have added the following in my eslintrc.json

"parserOptions": {
        "ecmaVersion": 6,
        "sourceType": "module",
        "allowImportExportEverywhere": true,
        "ecmaFeatures": {
            "modules": true,
            "arrowFunctions": true,
            "classes": true
        }
    }

Please help with how I can resolve this issue, also a full-fledged example of setting up es6 in angular with gulp would be really helpful.

1
javascriptangularjsgulpecmascript-6eslint

1 Answers

0
votes

Please try renaming your configuration file from eslintrc.json to .eslintrc.json.