在進修webpack集成的過程當中，碰到集成typescript時報以下毛病“Can not read property ‘WatchRun’ of undefined”。以下圖：

此時假如翻開編譯后的bundle.js在最底部會有以下代碼：

(function(module, exports) {

throw new Error("Module build failed: TypeError: Cannot read property 'watchRun' of undefined\n    at setupWatchRun (D:\\webpack project\\webpack延續集成\\3-1運用ES6言語\\node_modules\\awesome-typescript-loader\\src\\instance.ts:369:17)\n    at Object.ensureInstance (D:\\webpack project\\webpack延續集成\\3-1運用ES6言語\\node_modules\\awesome-typescript-loader\\src\\instance.ts:137:2)\n    at compiler (D:\\webpack project\\webpack延續集成\\3-1運用ES6言語\\node_modules\\awesome-typescript-loader\\src\\index.ts:47:19)\n    at Object.loader (D:\\webpack project\\webpack延續集成\\3-1運用ES6言語\\node_modules\\awesome-typescript-loader\\src\\index.ts:16:12)");

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

這是由於typescript的配置文件tsconfig.json中的sourceMap參數決議的：

這個參數就是為了輕易調試typescript。在報錯以後毛病會在瀏覽器的控制台里顯現，就是圖一的毛病顯現。

報這個錯的重要原因是typescript加載器的版本和webpack的版本不兼容致使：

官方有許多typescript加載器的loader。我用的是awesome-typescript-loader 5.0.0的版本，webpack版本此時是3.12.0版本的。把webpack版本更新到4.x能夠處理了。

注重：4.x版本的webpack需要和webpack-cli合營運用，裝置完成后的package.json問價以下：

裝置以後從新編后的效果以下圖：

再翻開瀏覽器頁面就能夠一般顯現了，控制台的報錯也消逝了。