Ts-loader: Fails when processing .js files

[AndrewRayCode]

I'm trying to drop typescript into an existing project. In my webpack config I have:

extensions: ['', '.js', '.jsx', '.json']

And my loaders:

loaders: [ 'react-hot-loader', 'babel-loader', 'ts-loader' ]

However, when I try to build, I now get:

ERROR in ./app/main.js
Module build failed: Error: Could not find file: './app/main.js'.
    at getValidSourceFile (node_modules/typescript/lib/typescript.js:43586:23)
    at Object.getEmitOutput (node_modules/typescript/lib/typescript.js:46680:30)
    at Object.loader (node_modules/ts-loader/index.js:408:34)
@ multi app

The only thing i've changed is adding ts-loader to the loader list. Is this because my main.js file doesn't have a .ts or .jsx extension?

[jbrantly]

Yea, TypeScript requires a file extension of .ts or .tsx (or .d.ts for definition files). I believe there is work going on to expand support for regular JavaScript in the future but for now you'll need to limit the use of ts-loader to only files with the TypeScript extensions. That doesn't mean you can't continue to use normal .js files in your webpack build. You can set .js files to go through babel and .ts files to go through ts-loader and then babel.

[raybooysen]

Can we close this now that Typescript 1.8 has been released?

[jbrantly]

Before closing this I'd like to test it out and make sure everything works. Would be good to get a unit test going as an example.

[aendrew]

Confirming that this is still an issue even with TypeScript 1.9.0-dev.20160220. I've basically just swapped babel as a loader in my Webpack config with ts-loader; setting it to consume .ts instead (and renaming my entry to .ts) fixes the problem.

[YuliaTsareva]

Still doesn't work. Any plans to fix it?

[toonketels]

We are looking to transition our js codebase to ts in gradual steps. For this, we want to use ts-loader to compile our js files.

What needs to be done to make this work (with allowJs flag set)?

Any pointers? Maybe I could take a look.

Thank you

[toonketels]

As a pointer for others needing to compile js files. It seems https://github.com/s-panferov/awesome-typescript-loader is handling this as expected.

[lostfictions]

Since Typescript's 1.8 release, I've been using it as a replacement for Babel in scenarios where I need a quick, minimal-configuration ES6-to-ES3/5 transpile, so this is a big annoyance to me. I guess I'll just try https://github.com/s-panferov/awesome-typescript-loader...

[johnnyreilly]

Closing as allowJs support shipped with 0.9.3

[nojvek]

This still doesn't work with allowJS. Not sure why you closed this without testing it.

[johnnyreilly]

It does but at present you need to use the entryFileIsJs option set. (This requirement will be dropped as part of the V3 release.)

We have a test in our test pack that covers this in case you're curious

[nojvek]

Thanks. Yeah after a bunch of debugging and reading code I sort of just figured it out. Just sending you a PR to add a vanilla-js as an example

[johnnyreilly]

Thanks @nojvek - PRs always appreciated!

[vp2177]

@toonketels This does not work with awesome-typescript-loader for me.
Is there a special config option that needs to be set?

[johnnyreilly]

allowJs in tsconfig.json. entryFileIsJs in ts-loader options (this won't be necessary when v3 ships)

[vp2177]

Sorry wasn't clear enough, I have this working with ts-loader, but it was claimed above that awesome-typescript-loader is "handling this as expected". I do have allowJs set, awesome-typescript-loader doesn't seem to have an entryFileIsJs option set.

[johnnyreilly]

entryFileIsJs is ts-loader specific and is due to be removed.

[johnnyreilly]

(usage of allowJs is enough to trigger this behaviour)

[seriousManual]

(usage of allowJs is enough to trigger this behaviour)

no its not

[johnnyreilly]

It will be when v3 is released. We will use allowJs as the trigger to change ts-loader behaviour

[nojvek]

Do you know when that is due to be released?

If there is something I can help with, let me know.

I've still been having some issues using typescript on a medium sized
hybrid js-ts project.

[johnnyreilly]

Probably in a week or so. However you can use that functionality now if you just set the entryFileIsJs ts-loader option