awesome-typescript-loader

awesome-typescript-loader copied to clipboard

Webpack 4 in beta now, so can you update plugin to support it?

Please update enhanced-resolve dependency binding

Any news?

I hope to find some time next weekend.

Hey, maybe you need some help? I've started building an updated configuration for all of our projects with webpack 4 and I've encountered some errors right away with awesome-typescript-loader on watch.

As I'm more than familiar with working on build tools and with typescript's compiler API, I think I could help 🙂

@DovydasNavickas I would glad if you make some investigation about what we need to do to properly migrate. I know that ts-loader already has some webpack4 support, so maybe we can use results of their's investigation.

Snap... ts-loader has a PR with quite a few changes. https://github.com/TypeStrong/ts-loader/pull/710/files

I guess a good starting point is this article: https://medium.com/webpack/webpack-4-migration-guide-for-plugins-loaders-20a79b927202

Ok, so it's an easy fix for a changed Webpack's API instead of compiler.plugin to use compiler.hooks.

So, to not get Webpack's errors we have to update function setupWatchRun in instance.ts line 367:

function setupWatchRun(compiler, instanceName: string) {
-	compiler.plugin('watch-run', function(watching, callback) {
-		const instance = resolveInstance(watching.compiler, instanceName)
+	compiler.hooks.watchRun.tapAsync(PACKAGE_NAME, (compiler, callback) => {
+		const instance = resolveInstance(compiler, instanceName)
		const checker = instance.checker
		const watcher =
-			watching.compiler.watchFileSystem.watcher ||
-			watching.compiler.watchFileSystem.wfs.watcher
+			compiler.watchFileSystem.watcher ||
+			compiler.watchFileSystem.wfs.watcher

-		const startTime = instance.startTime || watching.startTime
+		const startTime = instance.startTime

But then it starts spitting out errors (58 errors in my case, to be exact) in Typescript's typechecking, such as:

ERROR in [at-loader] TS2688: Cannot find type definition file for 'node'.

ERROR in [at-loader] TS2318: Cannot find global type 'Array'.

ERROR in [at-loader] TS2318: Cannot find global type 'Boolean'.

ERROR in [at-loader] TS2318: Cannot find global type 'Function'.

ERROR in [at-loader] TS2318: Cannot find global type 'IArguments'.

ERROR in [at-loader] TS2318: Cannot find global type 'Number'.

ERROR in [at-loader] TS2318: Cannot find global type 'Object'.

ERROR in [at-loader] TS2318: Cannot find global type 'RegExp'.

ERROR in [at-loader] TS2318: Cannot find global type 'String'.

Soo.... It clearly has some problems with compiler configuration before it starts compiling after watch change and I'm not really sure where to start looking. Maybe you could take a look? I'll spend a bit more time, if you see nothing and don't come up with a quick fix 🙂

By the way, exactly same kind of upgrade has to be done for setupAfterCompile function in line 444. Just not sure what to do with lines 462 and 464 as the parameter coming into tapAsync function is compiler instead of compiler coming as compilation.compiler before.

In short, I'll have to spend a bit more time to get a good sense about how the library works, because I did not manage to come up with a proper debugging strategy apart from npm link the package into a test project using Webpack and console.log interesting bits. If you have ideas how to have a proper debugging session, I'm happy to hear 😄

P.S. now that I think of it, why the hell didn't I go with using tests right away?... I guess sometimes you just don't think on Sundays 😂

So I noticed that I get the following error when the following web pack plugin is enabled TsConfigPathsPlugin. I'm using web pack 4.

/app/node_modules/tapable/lib/Tapable.js:63
                throw new Error(`Plugin could not be registered at '${name}'. Hook was not found.\n` +
        ^
Error: Plugin could not be registered at 'module'. Hook was not found.
BREAKING CHANGE: There need to exist a hook at 'this.hooks'. To create a compatiblity layer for this hook, hook into 'this._pluginCompat'.
    at Compiler.plugin (/app/node_modules/tapable/lib/Tapable.js:63:9)
    at Compiler.deprecated [as plugin] (internal/util.js:53:15)
    at ModulesInRootPlugin.apply (/app/node_modules/enhanced-resolve/lib/ModulesInRootPlugin.js:15:11)
    at Compiler.apply (/app/node_modules/tapable/lib/Tapable.js:71:16)
    at Compiler.deprecated [as apply] (internal/util.js:53:15)
    at PathPlugin.apply (/app/node_modules/awesome-typescript-loader/src/paths-plugin.ts:115:22)
    at webpack (/app/node_modules/webpack/lib/webpack.js:37:12)
    at startDevServer (/app/node_modules/webpack-dev-server/bin/webpack-dev-server.js:379:16)
    at processOptions (/app/node_modules/webpack-dev-server/bin/webpack-dev-server.js:361:5)
    at Object.<anonymous> (/app/node_modules/webpack-dev-server/bin/webpack-dev-server.js:504:1)
    at Module._compile (module.js:662:30)
    at Object.Module._extensions..js (module.js:673:10)
    at Module.load (module.js:575:32)
    at tryModuleLoad (module.js:515:12)
    at Function.Module._load (module.js:507:3)
    at Function.Module.runMain (module.js:703:10)

Has anyone found a work around for this? I'm also hitting the issue with #541 on incremental rebuilds

Same problem for me with Webpack 4.0.1 and the latest version of the plugin.

Problems with v4.0.0-0 Webpack version 4.0.1

at-loader]: Child process failed to process the request:  TypeError: compiler.createWatchProgram is not a function
[0]     at createWatch (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:144:19)
[0]     at processInit (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:312:11)
[0]     at E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:593:6
[0]     at Object.send (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:48:6)
[0]     at Checker.req (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\checker.ts:100:15)
[0]     at new Checker (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\checker.ts:78:8)
[0]     at Object.ensureInstance (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\instance.ts:139:18)
[0]     at compiler (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\index.ts:47:19)
[0]     at Object.loader (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\index.ts:16:12)
[0]     at LOADER_EXECUTION (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:119:14)
[0]     at runSyncOrAsync (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:120:4)
[0]     at iterateNormalLoaders (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:229:2)
[0]     at iterateNormalLoaders (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:218:10)
[0]     at E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:233:3
[0]     at context.callback (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:111:13)
[0]     at Object.module.exports (E:\xampp\htdocs\flinch-frontend\node_modules\tslint-loader\index.js:141:3)
[0]     at LOADER_EXECUTION (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:119:14)
[0]     at runSyncOrAsync (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:120:4)
[0]     at iterateNormalLoaders (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:229:2)
[0]     at Array.<anonymous> (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:202:4)
[0]     at Storage.finished (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:43:16)
[0]     at provider (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:79:9)
[0]     at E:\xampp\htdocs\flinch-frontend\node_modules\graceful-fs\graceful-fs.js:78:16
[0]     at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:511:3)
[0] [at-loader]: Child process failed to process the request:  TypeError: Cannot read property 'updateRootFileNames' of undefined
[0]     at getProgram (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:150:10)
[0]     at getEmitOutput (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:394:19)
[0]     at emit (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:413:24)
[0]     at processEmit (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:448:22)
[0]     at E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:602:6
[0]     at Object.send (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:48:6)
[0]     at Checker.req (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\checker.ts:100:15)
[0]     at Checker.emitFile (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\checker.ts:105:15)
[0]     at transform (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\index.ts:132:26)
[0]     at transformationFunction (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\index.ts:74:40)
[0]     at compiler (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\index.ts:85:21)
[0]     at Object.loader (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\index.ts:16:12)
[0]     at LOADER_EXECUTION (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:119:14)
[0]     at runSyncOrAsync (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:120:4)
[0]     at iterateNormalLoaders (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:229:2)
[0]     at iterateNormalLoaders (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:218:10)
[0]     at E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:233:3
[0]     at context.callback (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:111:13)
[0]     at Object.module.exports (E:\xampp\htdocs\flinch-frontend\node_modules\tslint-loader\index.js:141:3)
[0]     at LOADER_EXECUTION (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:119:14)
[0]     at runSyncOrAsync (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:120:4)
[0]     at iterateNormalLoaders (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:229:2)
[0]     at Array.<anonymous> (E:\xampp\htdocs\flinch-frontend\node_modules\loader-runner\lib\LoaderRunner.js:202:4)
[0]     at Storage.finished (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:43:16)
[0]     at provider (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:79:9)
[0]     at E:\xampp\htdocs\flinch-frontend\node_modules\graceful-fs\graceful-fs.js:78:16
[0]     at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:511:3)
[0] [at-loader]: Child process failed to process the request:  TypeError: Cannot read property 'getProgram' of undefined
[0]     at getProgram (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:152:16)
[0]     at processFiles (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:458:11)
[0]     at E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:608:6
[0]     at Object.send (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\runtime.ts:48:6)
[0]     at Checker.req (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\checker.ts:100:15)
[0]     at Checker.getFiles (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\checker\checker.ts:141:15)
[0]     at E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\instance.ts:469:34
[0]     at AsyncSeriesHook.eval [as callAsync] (eval at create (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:16:1)
[0]     at AsyncSeriesHook.lazyCompileHook [as _callAsync] (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\Hook.js:35:21)
[0]     at compilation.seal.err (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\lib\Compiler.js:467:30)
[0]     at AsyncSeriesHook.eval [as callAsync] (eval at create (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:6:1)
[0]     at AsyncSeriesHook.lazyCompileHook [as _callAsync] (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\Hook.js:35:21)
[0]     at hooks.optimizeAssets.callAsync.err (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\lib\Compilation.js:957:35)
[0]     at _err0 (eval at create (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:11:1)
[0]     at LastCallWebpackPlugin.process (E:\xampp\htdocs\flinch-frontend\node_modules\last-call-webpack-plugin\index.js:126:12)
[0]     at E:\xampp\htdocs\flinch-frontend\node_modules\last-call-webpack-plugin\index.js:197:12
[0]     at AsyncSeriesHook.eval [as callAsync] (eval at create (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:7:1)
[0]     at AsyncSeriesHook.lazyCompileHook [as _callAsync] (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\Hook.js:35:21)
[0]     at hooks.optimizeChunkAssets.callAsync.err (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\lib\Compilation.js:948:32)
[0]     at _err0 (eval at create (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:11:1)
[0]     at LastCallWebpackPlugin.process (E:\xampp\htdocs\flinch-frontend\node_modules\last-call-webpack-plugin\index.js:126:12)
[0]     at E:\xampp\htdocs\flinch-frontend\node_modules\last-call-webpack-plugin\index.js:194:12
[0]     at AsyncSeriesHook.eval [as callAsync] (eval at create (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:7:1)
[0]     at AsyncSeriesHook.lazyCompileHook [as _callAsync] (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\Hook.js:35:21)
[0]     at hooks.additionalAssets.callAsync.err (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\lib\Compilation.js:943:36)
[0]     at _err0 (eval at create (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:11:1)
[0]     at compilation.hooks.additionalAssets.tapAsync.assetCb (E:\xampp\htdocs\flinch-frontend\node_modules\extract-text-webpack-plugin\dist\index.js:330:9)
[0]     at AsyncSeriesHook.eval [as callAsync] (eval at create (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:7:1)
[0]     at AsyncSeriesHook.lazyCompileHook [as _callAsync] (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\Hook.js:35:21)
[0]     at hooks.optimizeTree.callAsync.err (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\lib\Compilation.js:939:32)

However works with [email protected], except when the watch triggers an update

E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\instance.ts:73
[0]      if (!compiler._tsInstances) {
[0]                    ^
[0] TypeError: Cannot read property '_tsInstances' of undefined
[0]     at resolveInstance (E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\instance.ts:73:20)
[0]     at E:\xampp\htdocs\flinch-frontend\node_modules\awesome-typescript-loader\src\instance.ts:366:26
[0]     at AsyncSeriesHook.eval [as callAsync] (eval at create (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:16:1)
[0]     at AsyncSeriesHook.lazyCompileHook [as _callAsync] (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\node_modules\tapable\lib\Hook.js:35:21)
[0]     at Watching._go (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\lib\Watching.js:40:32)
[0]     at Watching._invalidate (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\lib\Watching.js:164:9)
[0]     at watcher.compiler.watchFileSystem.watch (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\lib\Watching.js:135:10)
[0]     at Watchpack.watcher.once (E:\xampp\htdocs\flinch-frontend\node_modules\webpack\lib\node\NodeWatchFileSystem.js:43:4)
[0]     at Object.onceWrapper (events.js:317:30)
[0]     at emitTwo (events.js:126:13)
[0]     at Watchpack.emit (events.js:214:7)
[0]     at Watchpack._onTimeout (E:\xampp\htdocs\flinch-frontend\node_modules\watchpack\lib\watchpack.js:142:7)
[0]     at ontimeout (timers.js:475:11)
[0]     at tryOnTimeout (timers.js:310:5)
[0]     at Timer.listOnTimeout (timers.js:270:5)

Getting the same error as @kevupton.

Versions:

• "typescript": "^2.7.2"
• "awesome-typescript-loader": "^3.5.0"
• "webpack": "^4.0.1"

I'm getting the same error (TypeError: Cannot read property '_tsInstances' of undefined).

• typescript: 2.7.2
• awesome-typescript-loader: 3.5.0
• webpack: 4.1.0

Is there any fix for this yet? I might have to look into migrating to ts-loader if it works there. I hope migrating isn't too much trouble.

Edit: I tried installing awesome-typescript-loader@next but it just fails to install with various errors. ts-loader it is then...

@ChrisTucker2000 Installing @next worked for me. The biggest issue now is that incremental builds don't work. I have to manually rebuild which kills productivity.

Same

I tested the version 4.0.0-1 and the loading of the libraries dom and es2015 does not work anymore. Here the error message: ERROR in [at-loader] TS6053: File 'C:/lib.dom.d.ts' not found. ERROR in [at-loader] TS6053: File 'C:/lib.es2015.d.ts' not found.

I have the same problem. I tried to use ts-loader like @s-panferov and @ChrisTucker2000 suggested. It was easy to configure and it automatically rebuilds just fine, it is however incredibly slow for me (~3 Min. vs 20 Sec. of a-t-l).

Here's a patch which you can apply with patch-package. It should do the job for version 3.5.0. File should be named patches/awesome-typescript-loader+3.5.0.patch

patch-package
--- a/node_modules/awesome-typescript-loader/dist/instance.js
+++ b/node_modules/awesome-typescript-loader/dist/instance.js
@@ -213,10 +212,11 @@ var filterMtimes = function (mtimes) {
 };
 function setupWatchRun(compiler, instanceName) {
     compiler.plugin('watch-run', function (watching, callback) {
-        var instance = resolveInstance(watching.compiler, instanceName);
+        var compiler = watching.compiler || watching;
+        var instance = resolveInstance(compiler, instanceName);
         var checker = instance.checker;
-        var watcher = watching.compiler.watchFileSystem.watcher
-            || watching.compiler.watchFileSystem.wfs.watcher;
+        var watcher = compiler.watchFileSystem.watcher ||
+            compiler.watchFileSystem.wfs.watcher;
         var startTime = instance.startTime || watching.startTime;
         var times = filterMtimes(watcher.getTimes());
         var lastCompiled = instance.compiledFiles;

@vincentw56 Tried to install next, but it cause many typechecker errors which does not occur on 3.5.0.

@sherlock1982 Patch seems to work. Thanks!

Sorry seems that version 5.0.0-0 now doesn't work anymore for me. Approx. 1200 errors starting with this. Don't really understand why it looks for lib.dom.d.ts in C:/. 3.5.0 worked ok.

ERROR in [at-loader] TS6053: File 'C:/lib.dom.d.ts' not found.

ERROR in [at-loader] TS6053: File 'C:/lib.es2015.d.ts' not found.

ERROR in [at-loader] TS2318: Cannot find global type 'Array'.

ERROR in [at-loader] TS2318: Cannot find global type 'Boolean'.

ERROR in [at-loader] TS2318: Cannot find global type 'IArguments'.

Hello everybody, do you know some public projects that use TypeScript & Webpack4 I can use for debugging purposes?

You can check AngualarStarter. It's still Webpack3 but easily upgradeable and uses AwesomeTypescriptLoader. Currentyl I ended up using 3.5.0 + my patch and it works ok.

ATS 5.0.0-0 is working fine for me.

@pamtbaau It works on the initial build, but on incremental builds using "watch", it does not work.

@vincentw56 That might be in your app... In mine it works fine in both initial and watch cycle.

@pamtbaau No it does not work even on initial build as for me with the same many errors as @sherlock1982 writes before

@s-panferov you can test on this project: https://github.com/javascript-obfuscator/javascript-obfuscator/tree/webpack-4

@sanex3339 this project doesn't have TsConfigPathsPlugin plugin enabled, but it also needs to be verified.

Tested at-loader 5.0.0-0 on another project of mine and it is working fine in both initial and watch cycle.

Have a look at angular5-electron-sqlite3-bootstrap4-webpack

5.0.0-0 fixed it for me. Thanks!

Thanks, 5.0 does the job for me too on my boilerplate.

Actually just found a case where it's not working yet, a different project, weird.

Same problem than before with version 5.0.0-0 ERROR in [at-loader] TS6053: File 'C:/lib.dom.d.ts' not found.

ERROR in [at-loader] TS6053: File 'C:/lib.es2015.d.ts' not found.

I have the same on 5.0.0-0:

[at-loader] TS6053: File 'C:/lib.dom.d.ts' not found.
[at-loader] TS6053: File 'C:/lib.dom.iterable.d.ts' not found.
[at-loader] TS6053: File 'C:/lib.es2015.d.ts' not found.
[at-loader] TS6053: File 'C:/lib.scripthost.d.ts' not found.

Followed by a lot of errrors from modules not being able to find standard lib types. However, I solved it by removing the explicit lib configuration from my tsconfig.json. Looks like there is something going wrong in resolving the paths to these library files.

If I remove the lib, I get other problems, for example: ERROR in [at-loader] ./node_modules/@angular/core/src/di/reflective_provider.d.ts:87:123 TS2304: Cannot find name 'Map'.

ERROR in [at-loader] ./node_modules/@angular/core/src/di/reflective_provider.d.ts:87:165 TS2304: Cannot find name 'Map'.

@lucho78 Unfortunately removing the lib config is not always a solution. It can only be done if you use the default set of libs. For most of my projects I need something different than the default.

Are you targeting ES5? The Map type is only included by default when using "target": "ES6" or above.

@flut1 I must be IE11 compliant

@Delagen I'm not entirely sure what you mean. The default lib setting does differ per target. See --lib option in the compiler options documentation

Again, I'm not suggesting that everyone should remove the lib option. Just saying that it's a temporary solution that worked for me as I'm using the default libs.

Just tested this with 5.0.0-0 and it is working fine now.

@s-panferov I modified one of your specs to demonstrate the issue.

@sherlock1982 thanks, this is helpful

It looks like the problem is only on Windows environments. So I cannot fix it quickly, because it's very hard to investigate windows problems on macos environment. Webpack works bad in virtual environments.

I will check tomorrow if I have time. If you can give me any hints where to look that would be awesome.

@s-panferov I ran into all the incremental build issues on osx.

Can also confirm, 5.0.0-0 is working perfectly. It's very slow however (over 10secs for a recompile) - and this is just on a small boilerplate that I'm testing it out on. Anyone else getting this?

@ruaanvds It is just as fast as it was before on mine. I have a very large project that I am working on and it recompiles within seconds.

Thanks, @vincentw56. It's probably misconfiguration on my part. Will dig around a bit more.

5.0.0-0 working fine in my project

works fine with the version 5.0.0-1

TsConfigPathsPlugin is not working? Error:

C:\Test\node_modules\enhanced-resolve\lib\ModulesInRootPlugin.js:15
				const target = resolver.ensureHook(this.target);
						  ^
TypeError: resolver.ensureHook is not a function
	at ModulesInRootPlugin.apply (C:\Test\node_modules\enhanced-resolve\lib\ModulesInRootPlugin.js:15:27)
	at PathPlugin.apply (C:\Test\node_modules\awesome-typescript-loader\src\paths-plugin.ts:116:71)
	at webpack (C:\Test\node_modules\webpack\lib\webpack.js:37:12)
	at processOptions (C:\Test\node_modules\webpack-cli\bin\webpack.js:427:16)
	at yargs.parse (C:\Test\node_modules\webpack-cli\bin\webpack.js:502:3)
	at Object.parse (C:\Test\node_modules\webpack-cli\node_modules\yargs\yargs.js:539:18)
	at C:\Test\node_modules\webpack-cli\bin\webpack.js:212:8
	at Object.<anonymous> (C:\Test\node_modules\webpack-cli\bin\webpack.js:504:3)
	at Module._compile (module.js:635:30)
	at Object.Module._extensions..js (module.js:646:10)
	at Module.load (module.js:554:32)
	at tryModuleLoad (module.js:497:12)
	at Function.Module._load (module.js:489:3)
	at Module.require (module.js:579:17)
	at require (internal/module.js:11:18)
	at Object.<anonymous> (C:\Test\node_modules\webpack\bin\webpack.js:12:2)
	at Module._compile (module.js:635:30)
	at Object.Module._extensions..js (module.js:646:10)
	at Module.load (module.js:554:32)
	at tryModuleLoad (module.js:497:12)
	at Function.Module._load (module.js:489:3)
	at Function.Module.runMain (module.js:676:10)
	at startup (bootstrap_node.js:187:16)
	at bootstrap_node.js:608:3

@cime yes, TsConfigPathsPlugin requires a migration, but they don't have any documentation and some research has to be done to find out how to change the code

i want to report the same issue as @flut1, although I really need those libraries, so i can't remove that lib property from my tsconfig.json. It's an issue related to environment path, have a look:

ERROR in [at-loader] TS6053: File 'D:/lib.dom.d.ts' not found.
ERROR in [at-loader] TS6053: File 'D:/lib.es2015.d.ts' not found.
ERROR in [at-loader] TS6053: File 'D:/lib.es5.d.ts' not found.

And I'm using webpack 4.1.1

@ozorOzora you need to use version 5.0.0-1

@ozorOzora this error should be fixed in both latest 4.x and 5.x branches. Please share your settings if it does not work for you

Still getting TypeError: resolver.ensureHook is not a function error with 5.0.0-1. Looks like TsConfigPathsPlugin plugin has not been updated yet.

/dev/node_modules/enhanced-resolve/lib/ModulesInRootPlugin.js:15
		const target = resolver.ensureHook(this.target);
                          ^
TypeError: resolver.ensureHook is not a function
    at ModulesInRootPlugin.apply (/dev/node_modules/enhanced-resolve/lib/ModulesInRootPlugin.js:15:27)
    at PathPlugin.apply (/dev/node_modules/awesome-typescript-loader/src/paths-plugin.ts:116:71)
    at webpack (/dev/node_modules/webpack/lib/webpack.js:37:12)
    at processOptions (/dev/node_modules/webpack-cli/bin/webpack.js:427:16)
    at yargs.parse (/dev/node_modules/webpack-cli/bin/webpack.js:500:3)
    at Object.parse (/dev/node_modules/webpack-cli/node_modules/yargs/yargs.js:543:18)
    at /dev/node_modules/webpack-cli/bin/webpack.js:212:8
    at Object.<anonymous> (/dev/node_modules/webpack-cli/bin/webpack.js:502:3)
    at Module._compile (module.js:660:30)
    at Object.Module._extensions..js (module.js:671:10)
    at Module.load (module.js:573:32)
    at tryModuleLoad (module.js:513:12)
    at Function.Module._load (module.js:505:3)
    at Module.require (module.js:604:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/dev/node_modules/webpack/bin/webpack.js:12:2)
    at Module._compile (module.js:660:30)
    at Object.Module._extensions..js (module.js:671:10)
    at Module.load (module.js:573:32)
    at tryModuleLoad (module.js:513:12)
    at Function.Module._load (module.js:505:3)
    at Function.Module.runMain (module.js:701:10)
    at startup (bootstrap_node.js:194:16)
    at bootstrap_node.js:618:3

Working for me now

Had the same issue, works with 5.0.0-0

Not sure if this plugin will help, but they have managed to migrate to webpack 4. It does a similar job as "PathPlugin".

https://github.com/dividab/tsconfig-paths-webpack-plugin

Replacing built-in TsConfigPathsPlugin plugin by "tsconfig-paths-webpack-plugin" seems to be working well enough.

@vladimiry Yes. Worked for me too :)

@vladimiry The plugin has an issue though. If your tsconfig.json extends another tsconfig.json, it throws an error indicating baseUrl not found :(

"tsconfig-paths-webpack-plugin: Found no baseUrl in tsconfig.json, not applying tsconfig-paths-webpack-plugin"

@giridhara-avadhani in general putting paths into the compilerOptions section requires defining baseUrl. I guess your issue might be happening because of how TS does configs extending https://github.com/Microsoft/TypeScript/pull/14178 You can try to define baseUrl explicitly in the tsconfig referenced by tsconfig-paths-webpack-plugin as a workaround.

@s-panferov is there a reason why typescript 2.7 is required in 5.0.0-1? Currently stable Angular 5.x requires 2.6. Any ideas when 5.0.0-1 will be official ?

@drrudkh it worked for me too

5.0.0-1 fixed it for me, although still working on a pcss caching issue I don't think is related.

Caching issue is chrome only

upgrading to 5.0.0-1 does not work for me

5.0.0-1 worked for me

• "awesome-typescript-loader": "^5.0.0-1",
• "typescript": "^2.8.1",
• "webpack": "^4.5.0",
• "webpack-cli": "^2.0.13",
• "webpack-dev-server": "^3.1.1"

@djpeach it worked, thanks

Guys, what are the changes to apply in the webpack.config.ts file to use awesome-typescript-loader 5 ?

@omatrot I didn't have to change anything in my webpack.config files to make it work. I just had to download it using Yarn/NPM.

Found it: https://stackoverflow.com/a/49203878/15186

When's v5 going to become official? Seems to work and everyone is here looking for it anyway

I tested with v5.0.0-1, but encountered this error:

Error: Cannot find module './dist' at Function.Module._resolveFilename (module.js:489:15) at Function.Module._load (module.js:439:25) at Module.require (module.js:517:17) at require (internal/module.js:11:18) at Object. (.../node_modules/awesome-typescript-loader/index.js:1:76) ...

Also I get this error.

Configured "paths" like:

"paths": {
  "@app/*": ["app/*"],
  "@models/*": ["app/models/*"]
}

And then got error:

.../node_modules/awesome-typescript-loader/src/paths-plugin.ts:119
		mappings.forEach(mapping => {
           ^
TypeError: Cannot read property 'tapAsync' of undefined

Upgrading TypeScript from 2.5.3 to 2.8.3 fixed the following error for me

TypeError: compiler.createWatchProgram is not a function

same as what @kevupton reported.

Thanks to @djpeach's comment, its working for me after updating typescript to 2.8.3 . it is however incredibly slow :(

@eddy14u webpack 4 defaults do production mode, which is very slow, since it does a lot. Have you tried development mode?

For anyone wondering, I got it working with v5.0.0, and this is my webpack.config.js

const { CheckerPlugin } = require('awesome-typescript-loader')
const TsConfigPathsPlugin = require('tsconfig-paths-webpack-plugin')

module.export = {
  resolve: {
    extensions: ['.ts', '.tsx'],
    plugins: [
      new TsConfigPathsPlugin({
        configFile: './tsconfig.json',
      }),
    ],
  },
  module: {
    rules: [
      {
        test: /\.(ts|tsx)$/,
        use: [
          {
            loader: 'awesome-typescript-loader',
            options: {
              silent: true,
              useBabel: true,
              babelOptions: {
                compact: process.env.NODE_ENV === 'production',
                highlightCode: true,
              },
              babelCore: '@babel/core',
              useCache: true,
            },
          },
        ],
      },
    ],
  },
  plugins: [new CheckerPlugin()],
}

Just did some upgrades myself, and have working builds with reload using

• webpack v4.16.1
• atl v5.2.0
• typescript 2.7.1 (see #570 )
• Angular 5.2.5 (fwiw)

Switching to ts-loader worked for us.

@dlabrecq I actually ended up doing the same after all was said done (in conjunction with ForkTFsCheckerWebpackPlugin).

My end goal was Angular v5 AoT build (SASS / TypeScript) with Karma + Jasmine and webpack v4, and found that ts-loader was playing nicer with that stack for our needs after further testing (performance and general interop with other tools we are using.)

I think in my previous comment, I hadn't implemented AoT yet and hadn't started benchmarking certain KPIs on our end, but technically it seems that they do work together, though YMMV.

@marcofugaro could you please share your package.json to check versions of dependencies as well as tsconfig.json

Hello!

I'm having the same error @kevupton had too: Child process failed to process the request: TypeError: Cannot read property 'updateRootFileNames' of undefined

This happens when I specify the compilerOptions.paths tsconfig.json option. compilerOptions.baseUrl is defined.

How can I resolve this? Is this still an open issue? I've tried adding the TsconfigPathsPlugin to the webpack's resolve.plugins array with no success.

TypeScript: 3.5.1 awesome-typescript-loader: 5.2.1

tsconfig.json (.storybook folder):

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "types": [
      "node"
    ]
  },
  "include": [
    "../lib/**/*.stories.tsx"
  ],
  "exclude": ["node_modules"],
  "files": [
    "./typings.d.ts"
  ]
}

tsconfig.json (root folder):

{
  "compilerOptions": {
    /* Basic Options */
    "incremental": true,                      /* Enable incremental compilation */
    "target": "es5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019' or 'ESNEXT'. */
    "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
    "lib": ["dom", "esnext"],                 /* Specify library files to be included in the compilation. */
    // "allowJs": true,                       /* Allow javascript files to be compiled. */
    // "checkJs": true,                       /* Report errors in .js files. */
    "jsx": "react",                           /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
    "declaration": true,                      /* Generates corresponding '.d.ts' file. */
    "declarationMap": true,                   /* Generates a sourcemap for each corresponding '.d.ts' file. */
    "sourceMap": true,                        /* Generates corresponding '.map' file. */
    // "outFile": "./",                       /* Concatenate and emit output to single file. */
    "outDir": "./dist",                       /* Redirect output structure to the directory. */
    // "rootDir": "./",                       /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
    // "composite": true,                     /* Enable project compilation */
    // "tsBuildInfoFile": "./",               /* Specify file to store incremental compilation information */
    // "removeComments": true,                /* Do not emit comments to output. */
    // "noEmit": true,                        /* Do not emit outputs. */
    // "importHelpers": true,                 /* Import emit helpers from 'tslib'. */
    "downlevelIteration": true,               /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
    // "isolatedModules": true,               /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */

    /* Strict Type-Checking Options */
    "strict": true,                           /* Enable all strict type-checking options. */
    // "noImplicitAny": true,                 /* Raise error on expressions and declarations with an implied 'any' type. */
    // "strictNullChecks": true,              /* Enable strict null checks. */
    // "strictFunctionTypes": true,           /* Enable strict checking of function types. */
    // "strictBindCallApply": true,           /* Enable strict 'bind', 'call', and 'apply' methods on functions. */
    // "strictPropertyInitialization": true,  /* Enable strict checking of property initialization in classes. */
    // "noImplicitThis": true,                /* Raise error on 'this' expressions with an implied 'any' type. */
    // "alwaysStrict": true,                  /* Parse in strict mode and emit "use strict" for each source file. */

    /* Additional Checks */
    // "noUnusedLocals": true,                /* Report errors on unused locals. */
    // "noUnusedParameters": true,            /* Report errors on unused parameters. */
    // "noImplicitReturns": true,             /* Report error when not all code paths in function return a value. */
    // "noFallthroughCasesInSwitch": true,    /* Report errors for fallthrough cases in switch statement. */

    /* Module Resolution Options */
    // "moduleResolution": "node",            /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
    "baseUrl": "./lib",                       /* Base directory to resolve non-absolute module names. */
    "paths": {
      "@theme": ["theme"],
      "@base/*": ["base/*"],
      "@typography": ["base/typography"],
      "@typography/*": ["base/typography/*"]
    },                                        /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
    // "rootDirs": [],                        /* List of root folders whose combined content represents the structure of the project at runtime. */
    "typeRoots": ["node_modules/@types", "./typings.d.ts"], /* List of folders to include type definitions from. */
    "types": ["react"],                       /* Type declaration files to be included in compilation. */
    // "allowSyntheticDefaultImports": true,  /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
    "esModuleInterop": true                   /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
    // "preserveSymlinks": true,              /* Do not resolve the real path of symlinks. */
    // "allowUmdGlobalAccess": true,          /* Allow accessing UMD globals from modules. */

    /* Source Map Options */
    // "sourceRoot": "",                      /* Specify the location where debugger should locate TypeScript files instead of source locations. */
    // "mapRoot": "",                         /* Specify the location where debugger should locate map files instead of generated locations. */
    // "inlineSourceMap": true,               /* Emit a single file with source maps instead of having a separate file. */
    // "inlineSources": true,                 /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */

    /* Experimental Options */
    // "experimentalDecorators": true,        /* Enables experimental support for ES7 decorators. */
    // "emitDecoratorMetadata": true,         /* Enables experimental support for emitting type metadata for decorators. */
  },
  "include": ["lib"],
  "exclude": ["node_modules"],
}

Result:

info @storybook/react v5.0.11
info
info => Loading presets
info => Loading presets
info => Loading custom addons config.
info => Loading custom webpack config (full-control mode).
info => Using base config because react-scripts is not installed.
 10% building 1/5 modules 4 active ...ook/core/dist/server/preview/globals.jsℹ ｢atl｣: Using [email protected] from typescript
ℹ ｢atl｣: Using tsconfig.json from /mnt/c/Users/g.furlan/Development/proj/packages/form-ui/tsconfig.json (in a forked process)
 19% building 76/81 modules 5 active ...ules/core-js/modules/_array-includes.js✖ ｢atl｣: Child process failed to process the request: Error: Debug Failure. False expression.
    at watchFailedLookupLocationOfResolution (/mnt/c/Users/g.furlan/Development/proj/node_modules/typescript/lib/typescript.js:93021:22)
    at Array.forEach (<anonymous>)
    at watchFailedLookupLocationOfNonRelativeModuleResolutions (/mnt/c/Users/g.furlan/Development/proj/node_modules/typescript/lib/typescript.js:93057:25)
    at Map.forEach (<anonymous>)
    at clearPerDirectoryResolutions (/mnt/c/Users/g.furlan/Development/proj/node_modules/typescript/lib/typescript.js:92794:50)
    at Object.finishCachingPerDirectoryResolution (/mnt/c/Users/g.furlan/Development/proj/node_modules/typescript/lib/typescript.js:92800:13)
    at createNewProgram (/mnt/c/Users/g.furlan/Development/proj/node_modules/typescript/lib/typescript.js:94246:29)
    at synchronizeProgram (/mnt/c/Users/g.furlan/Development/proj/node_modules/typescript/lib/typescript.js:94227:17)
    at Object.createWatchProgram (/mnt/c/Users/g.furlan/Development/proj/node_modules/typescript/lib/typescript.js:94176:9)
    at createWatch (/mnt/c/Users/g.furlan/Development/proj/node_modules/awesome-typescript-loader/dist/checker/runtime.js:134:25)
✖ ｢atl｣: Child process failed to process the request: TypeError: Cannot read property 'updateRootFileNames' of undefined
    at getProgram (/mnt/c/Users/g.furlan/Development/proj/node_modules/awesome-typescript-loader/dist/checker/runtime.js:139:19)
    at getEmitOutput (/mnt/c/Users/g.furlan/Development/proj/node_modules/awesome-typescript-loader/dist/checker/runtime.js:326:23)
    at emit (/mnt/c/Users/g.furlan/Development/proj/node_modules/awesome-typescript-loader/dist/checker/runtime.js:340:31)
    at processEmit (/mnt/c/Users/g.furlan/Development/proj/node_modules/awesome-typescript-loader/dist/checker/runtime.js:374:26)
    at process.<anonymous> (/mnt/c/Users/g.furlan/Development/proj/node_modules/awesome-typescript-loader/dist/checker/runtime.js:497:21)
    at process.emit (events.js:200:13)
    at emit (internal/child_process.js:876:12)
    at processTicksAndRejections (internal/process/task_queues.js:84:9)

[... continues]

Thanks!

P.S. I tried avoiding extending tsconfig without resolving the issue.