webpack: _angular2.default.module is not a function

hi there, I having this annoying issue, I’m working on a huge app, and mostly of its packages are from npm and that’s pretty cool 😃 the problem is that there are some packages only available on bower so I have to setup webpack to use bower as is in the documentation by using resolve and the webpack.ResolverPlugin.

here is my webpack.config.js file

var path = require('path'),
      webpack = require('webpack');

var config = {
   //context: __dirname + '/client/app/app.js',
   devtool: 'source-map',
   stats: {
      colors: true,
      reasons: true
   },
   entry: [
      'babel-polyfill',
      './client/crm/crm.js',
      './client/crm/assets/stylus/styles.styl'
   ],
   output: {
      path: __dirname + '/client/build',
      publicPath: 'http://localhost:1989/assets/',
      filename: 'bundle.js'
   },
   resolve: {
      modulesDirectories: ['node_modules', 'bower_components']
   },
   module: {
      preLoaders: [{test: /\.js$/, loader: 'jshint-loader', exclude: /node_modules/}],
      loaders: [
         {
            test: /\.js$/,
            loader: 'babel',
            exclude: [
               path.resolve(__dirname, 'node_modules')
            ],
            // Options to configure babel with
            query: {
               plugins: ['transform-runtime'],
               presets: ['es2015', 'stage-0']
            }
         },
         {test: /\.html$/, loader: 'html', exclude: /node_modules/},
         {test: /\.css$/,  loader: 'style!css', exclude: /node_modules/},
         {test: /\.styl$/, loader: 'style!css!stylus', exclude: /node_modules/},
         {test: /\.png/,   loader: 'url?limit=100000&mimetype=image/png' },
         {test: /\.jpg/,   loader: 'file-loader' },
         {test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'url-loader'},
         {test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'url-loader' }
      ]
   },
   plugins: [
      new webpack.ResolverPlugin(
         new webpack.ResolverPlugin.DirectoryDescriptionFilePlugin('bower.json', ['main'])
      )
   ]
};

if (process.env.NODE_ENV === 'production') {
   config.output.path = __dirname + '/dist';
   config.plugins.push(new webpack.optimize.UglifyJsPlugin());
   config.devtool = 'source-map';
}

module.exports = config;

and it loads the bower package that I need.

but I got this error when run the app.

Uncaught TypeError: _angular2.default.module is not a function

this is were the error points

but if I remove the plugin

 new webpack.ResolverPlugin(
         new webpack.ResolverPlugin.DirectoryDescriptionFilePlugin('bower.json', ['main'])
      )

everything runs normally but doesn’t load the bower package I need

hope you someone can help me, my boss will kill if I can’t get this working, thanks for your attention