awesome-typescript-loader无法加载ts文件

Question

It was all good before my fellow clone the project and run npm install, npm start command. So I cleaned my node_modules to reproduce the issue in my env, then both of us stuck here. Any suggestion that what we can do?

tsc -v 2.1.1

error log:

 ERROR in ./src/polyfills.browser.ts Module build failed: TypeError: Cannot read property 'exclude' of undefined at applyDefaults (/Users/georgelin/Desktop/workspace/myApp/Jelly-Node/client/node_modules/awesome-typescript-loader/src/instance.ts:266:72) at Object.ensureInstance (/Users/georgelin/Desktop/workspace/myApp/Jelly-Node/client/node_modules/awesome-typescript-loader/src/instance.ts:145:5) at compiler (/Users/georgelin/Desktop/workspace/myApp/Jelly-Node/client/node_modules/awesome-typescript-loader/src/index.ts:37:20) at Object.loader (/Users/georgelin/Desktop/workspace/myApp/Jelly-Node/client/node_modules/awesome-typescript-loader/src/index.ts:18:18) 

@ multi polyfills

my package.json

  "dependencies": {
    "@angular/common": "2.2.1",
    "@angular/compiler": "2.2.1",
    "@angular/core": "2.2.1",
    "@angular/forms": "2.2.1",
    "@angular/http": "2.2.1",
    "@angular/material": "^2.0.0-alpha.10",
    "@angular/platform-browser": "2.2.1",
    "@angular/platform-browser-dynamic": "2.2.1",
    "@angular/router": "3.1.1",
    "@angularclass/hmr": "~1.2.0",
    "@angularclass/hmr-loader": "~3.0.2",
    "@baumi/angular2-select": "^2.2.1",
    "angular-2-local-storage": "0.0.18",
    "angular2-fontawesome": "^0.5.1",
    "assets-webpack-plugin": "^3.4.0",
    "core-js": "^2.4.1",
    "d3": "^4.3.0",
    "d3-brush": "^1.0.3",
    "es6-shim": "^0.35.0",
    "font-awesome": "^4.7.0",
    "hammerjs": "^2.0.8",
    "lodash": "^4.15.0",
    "ng2-jsoneditor": "^0.1.0",
    "ng2-resource-rest": "^1.5.1",
    "ng2-select": "^1.1.2",
    "ng2-translate": "^3.1.3",
    "reflect-metadata": "^0.1.3",
    "rxjs": "5.0.0-beta.12",
    "ts-events": "^3.1.4",
    "zone.js": "^0.6.12"
  },
  "devDependencies": {
    "@types/chai": "^3.4.34",
    "@types/core-js": "^0.9.34",
    "@types/d3": "^3.5.36",
    "@types/d3-brush": "^1.0.5",
    "@types/d3-drag": "^1.0.5",
    "@types/d3-selection": "^1.0.5",
    "@types/d3-tip": "^3.5.2",
    "@types/hammerjs": "^2.0.33",
    "@types/jasmine": "^2.2.34",
    "@types/lodash": "^4.14.37",
    "@types/node": "^6.0.38",
    "@types/protractor": "^1.5.20",
    "@types/selenium-webdriver": "2.44.29",
    "@types/source-map": "^0.1.27",
    "@types/uglify-js": "^2.0.27",
    "@types/webpack": "^1.12.34",
    "angular2-router-loader": "^0.3.4",
    "angular2-template-loader": "^0.5.0",
    "awesome-typescript-loader": "^2.2.4",
    "codelyzer": "^1.0.0-beta.3",
    "compression-webpack-plugin": "^0.3.1",
    "copy-webpack-plugin": "^2.1.3",
    "css-loader": "^0.23.1",
    "es6-promise": "^3.1.2",
    "es6-promise-loader": "^1.0.1",
    "es7-reflect-metadata": "^1.6.0",
    "exports-loader": "^0.6.3",
    "expose-loader": "^0.7.1",
    "file-loader": "^0.8.5",
    "html-webpack-plugin": "^2.15.0",
    "http-server": "^0.9.0",
    "imports-loader": "^0.6.5",
    "istanbul-instrumenter-loader": "^0.2.0",
    "json-loader": "^0.5.4",
    "karma": "^1.2.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-coverage": "^1.1.1",
    "karma-jasmine": "^1.0.2",
    "karma-mocha-reporter": "^2.0.0",
    "karma-phantomjs-launcher": "^1.0.2",
    "karma-remap-coverage": "^0.1.1",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-webpack": "1.8.0",
    "node-sass": "^3.6.0",
    "parse5": "^2.2.2",
    "protractor": "^4.0.9",
    "raw-loader": "0.5.1",
    "rimraf": "^2.5.2",
    "sass-loader": "^4.0.2",
    "script-ext-html-webpack-plugin": "^1.3.2",
    "source-map-loader": "^0.1.5",
    "string-replace-loader": "1.0.5",
    "style-loader": "^0.13.1",
    "to-string-loader": "^1.1.4",
    "ts-helpers": "1.1.2",
    "ts-node": "^1.3.0",
    "tslint": "^4.0.0-dev.0",
    "tslint-loader": "^2.1.3",
    "typedoc": "^0.5.0",
    "typescript": "^2.0.3",
    "typings": "^0.7.12",
    "url-loader": "^0.5.7",
    "v8-lazy-parse-webpack-plugin": "^0.3.0",
    "webpack": "2.1.0-beta.25",
    "webpack-dev-middleware": "^1.6.1",
    "webpack-dev-server": "2.1.0-beta.9",
    "webpack-md5-hash": "^0.0.5",
    "@types/isomorphic-fetch": "0.0.30",
    "typed-graphql": "^1.0.1",
    "webpack-merge": "^1.0.1"
  },

tsconfig

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "sourceMap": true,
    "noEmitHelpers": true,
    "baseUrl": "./src",
    "strictNullChecks": false,
    "paths": {
    },
    "lib": [
      "dom",
      "es6"
    ],
    "types": [
      "lodash",
      "d3"
    ]
  },
  "exclude": [
    "node_modules",
    "dist"
  ],
  "filesGlob": [
    "./src/**/*.ts",
    "./test/**/*.ts",
    "!./node_modules/**/*.ts",
    "src/custom-typings.d.ts",
    "typings/browser.d.ts"
  ],
  "awesomeTypescriptLoaderOptions": {
    "resolveGlobs": true,
    "forkChecker": true
  },
  "compileOnSave": false,
  "buildOnSave": false,
  "atom": {
    "rewriteTsconfig": false
  }
}

Answer 1

TypeScript 2.1 has breaking changes that don't currently work with Angular.

Change your version of Typescript from ^2.0.3 to ~2.0.3, delete your node_modules, and try again?

Answer 2

I was also facing the same issue and changing the version of typescript alone didn't work for me. Preceding steps helped me.

1. Run "npm cache clean" if npm version is below 5, or run "npm cache verify"
2. Go to your package.json
3. Change the version of "awesome-typescript-loader": "^2.2.4" to "awesome-typescript-loader": "2.2.4"
4. Change the version of typescript "typescript": "^2.0.3" to "typescript": "2.0.3"
5. Run "npm install"

Now run "npm run build" if you have configured build, or run "npm start" , I am sure you will not get the error again.