CODEWITHSUNDEEP
angulartypescriptwebpack
Ignatius Andrew
Ignatius Andrew

Reputation: 8258

webpack Error: Final loader didn't return a Buffer or String

When I do a build with systemjs its successful, but when I do with webpack, I get this error.. Error: Final loader didn't return a Buffer or String

Upvotes: 8

Views: 14240

Answers (3)

Alfa
Alfa

Reputation: 975

Today, I also faced the same issue, i applied all the above mentioned points. However every above answer was unable to resolve the same and then i found that i added a semicolon extra in my code which is causing the error.

Remove extra semicolon after constructor.

class MyClass {
    constructor(){

    };
}

new MyClass();

I removed the semicolon and everything works fine.

 class MyClass {
    constructor(){

    }
}

new MyClass();

Upvotes: 0

allenhwkim
allenhwkim

Reputation: 27738

After long trial and trial, I changed to ts-loader, and the error disappeared.

  module: {
    loaders: [
      {test: /\.ts$/, loader: 'ts' },
      {test: /\.css$/, loader: 'style!css'},
      {test: /\.html/, loader: 'html'},
      {test: /\.tsx?$/, loader: 'ts-loader'},
      // {test: /\.tsx?$/, loader: 'awesome-typescript-loader'},
      //{test: /\.(ico|png|jpg|gif|svg|eot|ttf|woff|woff2)(\?.+)?$/, loader: 'url?limit=50000'}
    ],
    preLoaders: [
      // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'.
      { test: /\.js$/, loader: 'source-map-loader' }
    ]
  },

Upvotes: 3

Ignatius Andrew
Ignatius Andrew

Reputation: 8258

Following are my findings after very long Investigation, and many more probably

First thing to check

If you are using ts-loader you may get

"No metadata available for the NgModule"

If its awesome-typescript-loader then you will get targeted error result like

  • "Final loader didn't return a Buffer or String"*.

What loader you are using the decision is upto to you , I prefer awesome- typescript-loader

Check for the following mishaps..

  1. import statement is pointing to the exact file;
  2. typo errors in the file name on import statement; importing the modules which are not present.

  3. check whether you have installed all the loaders like

    css-loader node-sass resolve-url-loader sass-loader\ style-loader url-loader

4.import statement is empty

ex: 

import * from '';

5. Services and Providers returning nothing may also cause this error.

Upvotes: 9

Related Questions