Why can't I get this app to complie the typescript files into javascript using webpack and awesome typescript loader?

Question

I have an angular 4 app and I'm using webpack and awesome typescript loader to compile the Typescript into js for the build. When I run npm run start for local it works but when I run npm run build it doesn't compile the typescript files into js and I get the following errors:

ERROR in [at-loader] ./src/components/app.module.ts:21:39 
    TS2305: Module '"/Users/*******/Desktop/*****/src/services/index"' has no exported member 'ArticlesService'.

ERROR in [at-loader] ./src/components/app.module.ts:27:10 
    TS2305: Module '"/Users/********/Desktop/*********/src/services/index"' has no exported member 'StateService'.

ERROR in [at-loader] ./src/components/views/activities/activities.component.ts:22:11 
    TS6133: 'currViewName' is declared but its value is never read.

ERROR in [at-loader] ./src/components/views/articles/articles.component.ts:23:11 
    TS6133: 'currViewName' is declared but its value is never read.

ERROR in [at-loader] ./src/components/views/forgot-password/forgot-password.component.ts:229:15 
    TS6133: 'errorStr' is declared but its value is never read.

ERROR in [at-loader] ./src/components/views/infusion-manager/infusion-manager.component.ts:118:11 
    TS6133: 'currViewName' is declared but its value is never read.

ERROR in [at-loader] ./src/components/views/profile/profile.component.ts:3:40 
    TS2305: Module '"/Users/*********/Desktop/**********/src/services/index"' has no exported member 'StateService'.

ERROR in [at-loader] ./src/components/views/profile/profile.component.ts:149:27 
    TS2339: Property 'updateUserData' does not exist on type 'UserApiService'.

ERROR in [at-loader] ./src/components/views/registration/registration.component.ts:229:43 
    TS2339: Property 'PATIENT' does not exist on type 'typeof Constants'.

ERROR in [at-loader] ./src/components/views/registration/registration.component.ts:235:24 
    TS2339: Property 'PATIENT' does not exist on type 'typeof Constants'.

ERROR in [at-loader] ./src/components/views/registration/registration.component.ts:278:25 
    TS2365: Operator '===' cannot be applied to types 'number' and 'string'.

ERROR in [at-loader] ./src/services/state.service.ts:7:11 
    TS6133: 'currState' is declared but its value is never read.
Child html-webpack-plugin for "index.html":
       [0] ./~/html-webpack-plugin/lib/loader.js!./src/index.html 1.54 kB {0} [built]
            factory:377ms building:9ms = 386ms
Child extract-text-webpack-plugin:
       [0] ./~/css-loader/lib/css-base.js 2.26 kB {0} [built]
           [] -> factory:1ms building:11ms = 12ms
       [1] ./src/style/fonts/Roboto-Bold.ttf 46 bytes {0} [built]
           [] -> factory:14ms building:1ms = 15ms
       [2] ./src/style/fonts/Roboto-Light.ttf 47 bytes {0} [built]
           [] -> factory:15ms building:0ms = 15ms
       [3] ./src/style/fonts/Roboto-Medium.ttf 48 bytes {0} [built]
           [] -> factory:14ms building:1ms = 15ms
       [4] ./src/style/fonts/Roboto-Regular.ttf 49 bytes {0} [built]
           [] -> factory:14ms building:1ms = 15ms
       [5] ./src/style/fonts/Roboto-Thin.ttf 46 bytes {0} [built]
           [] -> factory:15ms building:0ms = 15ms
       [6] ./~/css-loader!./~/postcss-loader/lib!./~/sass-loader/lib/loader.js!./src/style/app.scss 23.9 kB {0} [built]
            factory:3ms building:72ms = 75ms
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! [email protected] build: `rimraf dist && webpack --progress --profile --bail`
npm ERR! Exit status 2
npm ERR! 
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/*********/.npm/_logs/2018-10-04T15_40_20_857Z-debug.log

Here is the webpack.config.js file for typescript:

var atlOptions = '';
 if (isTest && !isTestWatch) {
 // awesome-typescript-loader needs to output inlineSourceMap for code coverage to work with source maps.
     atlOptions = 'inlineSourceMap=true&sourceMap=false';
  }

config.module = {
  rules: [
    // Support for .ts files.
  {
     test: /\.ts$/,
     loaders: ['awesome-typescript-loader?' + atlOptions, 'angular2-template-loader', '@angularclass/hmr-loader'],
    exclude: [isTest ? /\.(e2e)\.ts$/ : /\.(spec|e2e)\.ts$/, /node_modules\/(?!(ng2-.+))/]
  }

This is from the tsconfig.json file:

  {
     "compilerOptions": {
     "target": "ES5",
    "module": "commonjs",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "sourceMap": true,
    "noEmitHelpers": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noStrictGenericChecks": true,
    "lib": ["es2015", "dom"]
  },
     "compileOnSave": false,
     "buildOnSave": false,
     "awesomeTypescriptLoaderOptions": {
     "forkChecker": true,
     "useWebpackText": true
  }
}

The dependencies used in this project are node 8.10.0, npm 6.1.0, webpack 2.6.1, awesome-typescript-loader 3.1.3, typescript 2.6.1

Is there something I left out?

Answer 1

when Run in local web-pack not check for all possible errors. If errors occurs just throw exceptions (In developing environment). But when building it check all errors that can be occurred in run time. you have have to fix these issues for building and get good build files.