First issue is that the typescript compiler removes import statements that are not used.

The compiler detects whether each module is used in the emitted JavaScript. If a module identifier is only ever used in type annotations and never as an expression then no require call is emitted for that module. This culling of unused references is a good performance optimization, and also allows for optional loading of those modules.

I assigned the imported value to a dummy array and it seems to fix this. Logging the value out to the console also works. (See my final note on why I couldn't simply pass it into the dependency array).

Second, my typescript file was missing an empty string in the resolve array:

resolve { extensions: ['', '.ts', '.js'] }

Without this it couldn't pull in the file for ui router.

A few things I noticed while working on this: webpack --display-error-details is super useful. For some reason it was looking for double .js.js extensions inside node_modules/angular-ui-router/release:

Finally, I'm not sure why but when I import the default value from angular-ui-router and I log it or set a breakpoint it shows up correctly as ui.router, but if I attempt to pass it into the dependency array it becomes undefined.

@types/angular-ui-router defines the following export inside their type file : export default "ui.router"; Which seems to cause issues when importing.