New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TypeError: customConfig.configure is not a function #2

Closed
Zensavona opened this Issue Mar 17, 2016 · 16 comments

Comments

Projects
None yet
7 participants
@Zensavona

Zensavona commented Mar 17, 2016

Hi guys,

I've come across an issue while using this bootstrapper, here's the error I'm getting in the browser console while running with npm run dev:

TypeError: customConfig.configure is not a function
    at eval (webpack:///./~/aurelia-bootstrapper-webpack/dist/commonjs/aurelia-bootstrapper-webpack.js?:60:27)

I did a bit of digging and found that on line 58-60 of aurelia-bootstrapper-webpack/dist/commonjs/aurelia-bootstrapper-webpack.js exists the following code. I did a bit of console.logging and I've added some comments indicating the values being passed into here which produce this error.

  // configModuleId === 'main'
  return loader.loadModule(configModuleId).then(function (customConfig) {
      // customConfig === {}
      return customConfig.configure(aurelia);
    });

Why this is happening, I'm not exactly sure, but my main.js looks like this:

import {bootstrap} from 'aurelia-bootstrapper-webpack';

import '../node_modules/bootstrap/dist/css/bootstrap.css';
import '../node_modules/font-awesome/css/font-awesome.css';
import '../assets/css/style.css';

bootstrap(function(aurelia) {
  aurelia.use
    .standardConfiguration()
    .developmentLogging()
    .plugin('aurelia-validation')
    .plugin('aurelia-dialog')
    .plugin('aurelia-flux')
    .feature('resources');

  aurelia.start().then(() => aurelia.setRoot('app', document.body));
});

I can strip it back to the following and still reproduce the error:

import {bootstrap} from 'aurelia-bootstrapper-webpack';

import '../node_modules/bootstrap/dist/css/bootstrap.css';
import '../node_modules/font-awesome/css/font-awesome.css';
import '../assets/css/style.css';

bootstrap(function(aurelia) {
  aurelia.use
    .standardConfiguration()
    .developmentLogging();

  aurelia.start().then(() => aurelia.setRoot('app', document.body));
});

Any ideas?

@Vheissu

This comment has been minimized.

Member

Vheissu commented Mar 23, 2016

I am experiencing the same issue as you. I am using the enhance feature and thought this was the reason. Evidently not. The fix I found was to add in a simple check to see if the configure method exists. When I put a breakpoint in, I can see it is trying to call configure on an empty object {}

@Vheissu

This comment has been minimized.

Member

Vheissu commented Mar 23, 2016

Try this PR: #4 - it fixes the issue for me.

@Vheissu

This comment has been minimized.

Member

Vheissu commented Mar 23, 2016

@Zensavona After speaking with @EisenbergEffect this appears to be a misunderstanding of the difference between Webpack and the standard Skeleton. If you use Webpack, you don't need an aurelia-app="main" attribute as you specify the main entry point inside of your Webpack configuration. After removing the aurelia-app attribute, the issue went away.

@Vheissu

This comment has been minimized.

Member

Vheissu commented Apr 5, 2016

@EisenbergEffect This can be closed.

@veikkoeeva

This comment has been minimized.

veikkoeeva commented Aug 28, 2016

It looks like the WebPack skeletons at https://github.com/aurelia/skeleton-navigation/blob/master/skeleton-typescript-webpack/index.html have <body aurelia-app="main"> defined. It looks like I'm running to this problem in my little demo at https://github.com/veikkoeeva/AureliaDemo/tree/master/src/AureliaDemo.FrontEnd and I'm a tad loss what would be the right configuration.

@niieani

This comment has been minimized.

Member

niieani commented Aug 28, 2016

@veikkoeeva Yeah, the new skeletons don't need you to use the bootstrapper manually, it works with the aurelia-app just as the JSPM skeletons.

@Sigfried

This comment has been minimized.

Sigfried commented Oct 6, 2016

I have no idea what I'm doing (first attempt using aurelia), but I'm getting this same error message. I'm trying to use https://github.com/code-chris/aurelia-knockout with a new aurelia-cli project. The instructions with aurelia-knockout are not clear to me, but this is what I'm trying:

I cp -r .../aurelia-knockout/dist/es2015 into .../src/aurelia-knockout in my new app. Then (with au run --watch) I get Error: ENOENT: no such file or directory, open .../src/knockout.js. So then I put a copy of knockout.min.js in .../src, and then au run doesn't complain anymore, but the browser console gives me the vendor-bundle.js:3394 TypeError: customConfig.configure is not a function error.

I can log this as an issue with aurelia-knockout, but I ended up here first from googling the error message.

@EisenbergEffect

This comment has been minimized.

Member

EisenbergEffect commented Oct 6, 2016

I would definitely ask a question on the aurelia-knockout plugin Github. I'm not sure how they put that plugin together. How they did that would probably affect your app's configuration. I can tell you that knockout shouldn't go in the src folder. Instead, put in in scripts or use npm to install it. In your CLI app's aurelia.json file you will need to add it as a dependency so you can map the name knockout to the knockout.min.js file.

@digitalheir

This comment has been minimized.

digitalheir commented Nov 15, 2016

I don't understand why this issue is closed?

skeleton-esnext-webpack still gives this error out of the box and provides a poor onboarding experience for Aurelia + webpack. The one with Gulp does work.

@EisenbergEffect

This comment has been minimized.

Member

EisenbergEffect commented Nov 15, 2016

@niieani Can you comment on this? Is this a breaking change in Weback's code again?

@digitalheir

This comment has been minimized.

digitalheir commented Nov 16, 2016

Oops, I'm in the wrong repo. My issue was with the navigation skeleton release at https://github.com/aurelia/skeleton-navigation/releases/tag/1.1.1 . I think this is the one. Excuse me.

@niieani

This comment has been minimized.

Member

niieani commented Nov 16, 2016

@EisenbergEffect yeah, it's breaking change in Webpack, basically we need to lock the webpack-dev-server too (we only locked 'webpack' before). We discussed it with @Vheissu already.

@EisenbergEffect

This comment has been minimized.

Member

EisenbergEffect commented Nov 16, 2016

Is that in a PR?

@niieani

This comment has been minimized.

Member

niieani commented Nov 16, 2016

I'll adjust the PR to use locked webpack versions so we don't get these sort of problems in the future. But I'm working on a fix for old skeletons now.

@EisenbergEffect

This comment has been minimized.

Member

EisenbergEffect commented Nov 16, 2016

Cool. Thanks!

@niieani

This comment has been minimized.

Member

niieani commented Nov 16, 2016

Fixes pushed to master aurelia/skeleton-navigation@cb30c75.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment