Unexpected token import in app.bundle.js angular2

Question

I'm trying to build an Angular 2 app from scratch with Webpack. After adding all the files and finishing all the configurations, i build the project. while building it didn't give any error. but when i open the index.html the text loads while giving an error in the console as "Uncaught SyntaxError: Unexpected token import in app.bundle.js:47"

this is the place where it results the import error

/***/ function(module, exports) {

    import 'core-js'; **//this is line 47**
    import 'reflect-metadata';
    import 'zone.js/dist/zone';

    import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
    import { AppModule }              from './app.module';

    platformBrowserDynamic().bootstrapModule(AppModule);

/***/ }
/******/ ]);

the repo of my project enter link description here

Any reason why im getting this error?.I've tried almost everyting

Answer 1

You have a typo in your webpack.config.js which caused webpack to not use any loaders and simply concatenate the raw typescript source files into the bundle.

The property is module.loaders not module.loader .

You will need something like

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

    root: path.resolve('src')
}

where path is imported with const path = require('path'); I don't know why it doesn't infer paths from the working directory...