webpack/typescript error "Invalid configuration object ... - configuration.resolve.extensions[0]"

Question

I followed this tutorial and then this tutorial as I am trying to use webpack with typescript. Everything was running fine after I finished the first tutorial (webpack w/out typescript).

However once I followed the second tutorial and ran npm run build I am getting this error:

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema. - configuration.resolve.extensions[0] should not be empty.

I have not been able to find a solution to this anywhere.

Here is my webpack.config.js file:

module.exports = {
  entry: './main.ts',
  output: {
    filename: './bundle.js'
  },
  resolve: {
    extensions: ['', '.ts']
  },
  module: {
    loaders: [
      { test: /.ts$/, loader: 'awesome-typescript-loader' }
    ]
  }
};

Any help?

Trash Can · Accepted Answer · 2017-05-10 03:01:34Z

4

The latest versions of webpack don't permit passing empty string to module.resolve.extensions array like you are doing, just remove the empty string or replace it with some extension you want to support

module.exports = {
  entry: './main.ts',
  output: {
    filename: './bundle.js'
  },
  resolve: {
    extensions: ['.ts'] // don't specify the empty string, add '.js' if you want to import plain javascript files into typescript 
  },
  module: {
    loaders: [ // should use 'rules' instead of 'loaders', 'loaders' is retained for backward compatability only
      { test: /.ts$/, loader: 'awesome-typescript-loader' }
    ]
  }
};

edited May 10, 2017 at 3:01

answered May 10, 2017 at 2:58

Trash Can

6,8325 gold badges27 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

krummens Over a year ago

I just figured this out right before I saw your answer. I'll mark this as right answer once I can. thank you

Trash Can Over a year ago

Also, module.loaders is the legacy field, it should be module.rules instead for the latest version

Trash Can Over a year ago

@krummens I did actually

krummens Over a year ago

Oh sorry. Didn't see that. Thanks.

Xelad1 Over a year ago

Do you know why webpack examples passed in empty strings in the first place?

Collectives™ on Stack Overflow

webpack/typescript error "Invalid configuration object ... - configuration.resolve.extensions[0]"

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related