Can't get aurelia-auth to bundle

[nathanchase]

I've noticed that even if I add aurelia-auth to my bundles declaration, it still demands to find the two following files directly via its absolute path because system.js cannot find them:

/jspm_packages/github/paulvanbladel/aurelia-auth@0.12.1/app.httpClient.config.js /jspm_packages/github/paulvanbladel/aurelia-auth@0.12.1/authFilter.js

the rest all seem to bundle just fine and any calls to the rest of the files within aurelia-auth successfully route inside my bundled aurelia.js file.

My bundle declaration is like this:

"dist/aurelia": { "includes": [ ... "aurelia-auth", ...

which results in a file "aurelia.js" that's loaded by system.js

Thoughts?

[paulvanbladel]

No idea. In fact,/app.httpClient.config.js is not used any longer. But that is probably not causing the problem.

[Vidarls]

might be related to your import statements.make sure you import from aurelia-auth not paulvanbladel/aurelia-auth. Has bitten me before

[nathanchase]

Here's what my app,js looks like currently. How should it be changed if app,httpClient.config.js is no longer used?

import {inject} from 'aurelia-framework';
import {Router} from 'aurelia-router';
import {AuthService} from 'aurelia-auth';
import AppRouterConfig from 'app.router.config';
import HttpClientConfig from 'aurelia-auth/app.httpClient.config';
import "whatwg-fetch";

@inject(Router, AuthService, HttpClientConfig, AppRouterConfig)
export class App {

    constructor(router, authService, httpClientConfig, appRouterConfig){
        this.router = router;
        this.authService = authService;
        this.httpClientConfig = httpClientConfig;
        this.appRouterConfig = appRouterConfig;
    }

    activate() { 
        this.httpClientConfig.configure();
        this.appRouterConfig.configure();  
        console.log("Authenticated: " +this.authService.isAuthenticated());
    }

    logout() {
        this.authService.logout("/login")
        .then(response=>{
            console.log("ok logged out on  logout.js");         
        })
        .catch(err=>{
            console.log("error logged out  logout.js");

        });
    }

    get isAuthenticated() {
        return this.auth.isAuthenticated();
    };

}

[Vidarls]

i believe the intention is that fetch client config should be used as the http client is in effect deprecated. Might be possible that the http client config is missing frome some package config? (not really a javascript packaging and dependency management expert yet).

[Vidarls]

How is your auth step import?

[nathanchase]

import config from './authConfig';
export function configure(aurelia) {
    aurelia.use
      .standardConfiguration()
      .developmentLogging();

    aurelia.use.plugin('aurelia-auth', (baseConfig)=>{
        baseConfig.configure(config);
    });
    ...

[nathanchase]

Ok, so I switched out my app,js to use fetch like so, and it got rid of the request to app.httpClient.config.js:

import {inject} from 'aurelia-framework';
import {Router} from 'aurelia-router';
import {AuthService} from 'aurelia-auth';
import AppRouterConfig from 'app.router.config';
import {FetchConfig} from 'aurelia-auth';
import "whatwg-fetch";

@inject(Router, AuthService, FetchConfig, AppRouterConfig)
export class App {

    constructor(router, authService, fetchConfig, appRouterConfig){
        this.router = router;
        this.authService = authService;
        this.fetchConfig = fetchConfig;
        this.appRouterConfig = appRouterConfig;
    }

    activate() { 
        this.fetchConfig.configure();
        this.appRouterConfig.configure();  
        console.log("Authenticated: " +this.authService.isAuthenticated());
    }

    logout() {
        this.authService.logout("/login")
        .then(response=>{
            console.log("ok logged out on  logout.js");         
        })
        .catch(err=>{
            console.log("error logged out  logout.js");

        });
    }

    get isAuthenticated() {
        return this.auth.isAuthenticated();
    };

}

So now all that's left is authFilter.js.

[paulvanbladel]

Indeed, we presume now fetch client. Therefor aurelia http client is no longer present as dependency. I should remover app.http client. Configuration from the sources.

[nathanchase]

Is it perhaps that authFilter is imported into aurelia.globalResources that's causing the issue?

aurelia.globalResources('./authFilter');

[nathanchase]

FWIW, after bundling, this is what is automatically generated in my config.js:

bundles: {
    "aurelia": [
     "github:paulvanbladel/aurelia-auth@0.12.1",
      "github:paulvanbladel/aurelia-auth@0.12.1/app.fetch-httpClient.config",
      "github:paulvanbladel/aurelia-auth@0.12.1/authService",
      "github:paulvanbladel/aurelia-auth@0.12.1/authUtils",
      "github:paulvanbladel/aurelia-auth@0.12.1/authentication",
      "github:paulvanbladel/aurelia-auth@0.12.1/authorizeStep",
      "github:paulvanbladel/aurelia-auth@0.12.1/baseConfig",
      "github:paulvanbladel/aurelia-auth@0.12.1/index",
      "github:paulvanbladel/aurelia-auth@0.12.1/oAuth1",
      "github:paulvanbladel/aurelia-auth@0.12.1/oAuth2",
      "github:paulvanbladel/aurelia-auth@0.12.1/popup",
      "github:paulvanbladel/aurelia-auth@0.12.1/storage",
     ...

authFilter is the only thing seemingly not included.

[Vidarls]

Just import and authstep like normal and use it in route config

[nathanchase]

What do you mean? How does that help this issue of authFilter not being included during bundling?

[RWOverdijk]

@nathanchase You have to include it in your bundle config yourself.

[nathanchase]

Ok. I added it explicitly and that seemed to work. Here's my complete Aurelia bundle:

"dist/aurelia": {
      "includes": [
        "aurelia-animator-css",
        "aurelia-auth",
        "aurelia-auth/authFilter",
        "aurelia-bootstrapper",
        "aurelia-fetch-client",
        "aurelia-framework",
        "aurelia-history-browser",
        "aurelia-http-client",
        "aurelia-loader-default",
        "aurelia-logging-console",
        "aurelia-router",
        "aurelia-templating-binding",
        "aurelia-templating-resources",
        "aurelia-templating-router",
        "whatwg-fetch"
      ],
      "options": {
        "inject": true,
        "minify": true
      }
    }

Thanks, all!

[RWOverdijk]

Bueno, glad I could help.