How to configure webpack.config.js when manual bootstrapping


Hi All,

I’m trying to manual bootstrap an Aurelia application using Webpack following this guide:

I’ve altered my main.ts file to use the bootstrap method rather than export a configure function in an otherwise vanilla project (just built a basic application using au cli). I’ve also removed the aurelia-app=“main” html attribute.

The problem i’m running into is that the code in my main module is seemingly never executed. I think this is because I don’t have my webpack.config.js set up correctly for this, the guide says I need to:

In case you use Webpack, you can replace the aurelia-bootstrapper-webpack package with the ./src/main entry file in the aurelia-bootstrapper bundle defined inside of webpack.config.js, and call the bootstrapper manually:

I’m new to webpack though and I’m having difficulty determining what needs to change. What settings do i need to change in my webpack.config.js to accomplish this?

I’ve tried this so far:

entry: {
//app: [‘aurelia-bootstrapper’],
app: [’./src/main.ts’],

But i get an error that it can’t load ‘aurelia-loader-context’ when I try to build. I’ve also tried this (and variations):

new AureliaPlugin({
  aureliaApp: './src/main.ts'

… it builds, but nothing is loaded in (main doesn’t seem to be executed).


I believe I’ve implemented what you’re trying to do here.

I had to use manual bootstrapping to support multiple Aurelia apps.

Pay close attention to the individual commits and let me know if that gets you where you’re looking to go.


Thanks! That is very close to what I’m trying to do, although I actually want to remove the aurelia-app html attribute if possible and initialize through some other means. The reason for this is that I’d like to have the ability to instantiate the app at a time of my choosing rather than at page load. Still, it’s very helpful to see your repo, thank you.