Angular 4 AOT compilation in hybrid app

Question

Currently, I'm working on upgrading an AngularJS app to Angular 4, using the upgrade module. With our current webpack config, it works fine, both in development and production.

When I added aot compilation through @ngtools/webpack, I got rid of all compilation errors, but there's a runtime error:

Error: [$injector:strictdi] r is not using explicit annotation and cannot be invoked in strict mode.

This shouldn't be an issue, though, because I'm using babel-plugin-angularjs-annotate. It only occurs when I add in the @ngtools/webpack loader; otherwise it works fine.

Here's the relevant section of the webpack config:

/* Loaders to handle scss, css, etc.*/

{test: /\.ts$/, use: "@ngtools/webpack"}, // Doesn't work
// Below lines work, if used instead of line above
//{ 
//  test: /\.ts$/,
//  loaders: ["awesome-typescript-loader", "angular2-template-loader"]
//},
{
  test: /\.js$/,
  exclude: [
    /node_modules/,
    path.join(__dirname, "src", "vendor")
  ],
  use: ["babel-loader", "eslint-loader"]
}

I also add in the aot plugin later on, but that's not what causes the issue.

And here's the entire .babelrc:

{
  "presets": [
    "es2015"
  ],
  "plugins": [
    "angularjs-annotate"
  ]
}