Using the following example repository.
https://github.com/raybooysen/ts-loader-example
If you npm install and then run webpack, webpack will output the following error:
ERROR in C:\source\ts-loader-example\tsconfig.json
error TS5055: Cannot write file 'C:/source/ts-loader-example/src/ts-loader-example/myId.js' because it would overwrite input file.
ERROR in ./src/ts-loader-example/headerBar.tsx
Module build failed: Error: Typescript emitted no output for C:\source\ts-loader-example\src\ts-loader-example\headerBar.tsx
at Object.loader (C:\source\ts-loader-example\node_modules\ts-loader\index.js:437:15)
I don't understand why this is happening. If, in Webpack, I write TS files that only import TS files, then there are no errors and typescript is not emitting any files anywhere.
Is this a misunderstanding on my part?
_UPDATE_
If I add, to my tsconfig file "outDir": "./RANDOM", then everything works, but there is never a folder called RANDOM created.
My TSConfig is as follows:
{
"compilerOptions": {
"noImplicitAny": false,
"removeComments": false,
"preserveConstEnums": true,
"sourceMap": true,
"noEmitOnError": true,
"noEmit": false,
"allowJs": true,
"jsx": "preserve",
"target": "es2015",
"module": "es2015"
},
"files": [
"typings/typings.d.ts"
]
}
webpack.config.js
var path = require('path');
var webpack = require('webpack');
var babelQuery = JSON.stringify({
presets: ['es2015', 'react']
});
module.exports = {
entry: [
'./src/ts-loader-example/index.js'
],
output: {
path: './build/',
filename: 'ts-loader-example.js',
libraryTarget: "umd",
library:"ts-loader-example",
},
debug: true,
//devtool: 'source-map',
module: {
loaders: [
{
test: /\.jsx?$/,
include: path.join(__dirname, 'src'),
loader: 'babel-loader',
query: {
presets: ['es2015', 'react']
}
},
{
test: /\.ts(x?)$/,
loader: 'babel?' + babelQuery + '!ts-loader'
}
]
}
};
There is a bug in ts-loader. Your entry file has to be always a *.ts file, otherwise it won't work even when allowJs is set to true.
I registered an issue already: #163
Thanks @tqmukas
Closing this as a duplicate.
@jbrantly Actually, I'm pretty sure this is a different issue since I walked him through it. When there's no out file or out directory, the TypeScript compiler is erroring because the .js file input would override the .js output. Obviously this isn't the case because everything is in memory, so I'd recommend setting phantom out and outDir by default to avoid this issue.
Whoops. I didn't actually triage in depth myself. Thanks!
@blakeembrey @jbrantly there is another way to solve this, see https://github.com/Microsoft/TypeScript/issues/7363
@s-panferov Thanks a bunch for the tip!
So, is the "right" way to solve this issue to have ts-loader use the suppressOutputPathCheck option? It's an internal option so it can't be set in tsconfig.json and would have to be set by ts-loader. I don't know if there are any potential negative side effects to this, but certainly it seems a lot nicer than setting a fake "outDir" :)
Actually, unless I'm missing something, with suppressOutputPathCheck being an internal option there's no way for ts-loader to even pass it to the compiler. Maybe I'm missing something, though.
@thomasboyt, hm, this option works quite well in awesome-typescript-loader, I even have some working tests with Salsa support and they fail when I disable this option. So it seems that it works. What compiler version are you using for test?
@s-panferov @thomasboyt I've just tried setting it in tsconfig.json, I'm using [email protected] + [email protected]:
error TS5023: Unknown compiler option 'suppressOutputPathCheck'.
This should be fixed with release 0.9.3
Most helpful comment
@blakeembrey @jbrantly there is another way to solve this, see https://github.com/Microsoft/TypeScript/issues/7363