ts-loader: ts-loader generating definition file in wrong directory

I am creating a new issue here as discussed in typescript Issue I am using typescript version 1.9.0-dev.20160412 and ts-loader version 0.8.2 as below My tsconfig.json is as below:

{
  "compileOnSave": false,
  "buildOnSave": false,
  "compilerOptions": {
    "module": "commonjs",
    "target": "es6",
    "moduleResolution": "node",
    "preserveConstEnums": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "noImplicitAny": false,
    "noEmitOnError": false,
    "forceConsistentCasingInFileNames": true,
    "removeComments": false,
    "sourceMap": true,
    "jsx": "react",
    "outDir": "./lib",
    "declaration": true
  },
  "exclude": [
    "node_modules",
    "dist",
    "typings/browser",
    "typings/browser.d.ts"
  ]
}

My project folder structure is as below:

work/
`-- projects
    `-- projectx
        |-- dist
        |-- src
        `-- tsconfig.json

I am trying to compile and generate .d.ts files inside the ‘lib’ dir but this creates the .d.ts file inside folder with parent attached to lib i.e

work/
`-- projects
    `-- projectx
        |-- src
        |-- dist
        |   `-- work
        |       `-- projects
        |           `-- projectx
        |               `-- dist
        |                   `-- lib
        |                       `-- src
        |                           `-- index.d.ts
        `-- tsconfig.json

I was expecting it to be as :

work/
`-- projects
    `-- projectx
        |-- dist
        |   `-- lib
        |       `-- src
        |           `-- index.d.ts
        |-- src
        `-- tsconfig.json 

dist dir above is given in the webpack.config.js as below:

output: {
    path: path.join(__dirname, '/dist'),
    filename: outputFile,
    library: libraryName,
    libraryTarget: 'umd',
    umdNamedDefine: true
  }

Sample project with the above mentioned error Sample Project. It works as expected with the version 0.8.0 of ts-loader

About this issue

  • Original URL
  • State: closed
  • Created 8 years ago
  • Reactions: 21
  • Comments: 30 (8 by maintainers)

Most upvoted comments

@johnnyreilly @gluons Sorry, my bad, you are right. Added the outDir to the compilerOptions and it works as expected.

    module: {
        rules: [
            {
                test: /\.tsx?$/,
                loader: "ts-loader",
                options: {
                    compilerOptions: {
                        outDir: './dist'
                    }
                }
            }
        ]
    }

Thank you!

@tedchirvasiu It works as intended in ts-loader v5. It’s breaking change.
You have to set outDir or declarationDir to specify the output directory of declaration files.

From @JonWallsten in #882 :

I would have to say that it’s intended (but maybe unwanted in some cases?). It’s TypeScripts default behavior to do this. If you don’t add outDir or declarationDir it might be intended, and you could get annoyed by a warning, since it’s in the context of TypeScript isn’t wrong.

Same issue in 4.2.0

Adding something like context: path.resolve("src") to the Webpack config is fixing this issue for me. Thanks @johnnyreilly!

Hey @tedchirvasiu

I’m pretty sure the changed behaviour is intentional - see the details here:

https://github.com/TypeStrong/ts-loader/pull/822

Hey @gluons,

Thanks for the detail. The issue should be resolved by this PR: https://github.com/TypeStrong/ts-loader/pull/822

I’m planning to merge and release this in future. Feel free to test out the PR ahead of release. Early feedback is always welcome!

I have the same problem. The path’s base when generating declaration seems to be the outDir. But for the typescript compiler it’s the project root. I can take a look at this and submit a PR if I find a solution.

Fixed on 0.9.3

Thanks for sharing the workaround @gluons!

@jamesots

I’m not sure how to fix it though, without potentially breaking other things.

My advice: get something that seems to work for you. Ignore failing tests and submit a PR. I’ll take a look and advise. If it’s promising I’ll try and help you get it over the finish line

I don’t know which version that this problem begin.

How can I help you? Maybe I will help you when I’m free.

Thanks - it’s fine to use this issue! Now, let’s see how dedicated you are… Would you be up for doing some investigation?

To give you a heads up, here’s the pr that fixed the issue last time: https://github.com/TypeStrong/ts-loader/pull/307/files

Looks like the important stuff was in the ensureTypeScriptInstance function in the index.ts file.

Of course that was a long time ago, the relevant code now seems to be in the provideDeclarationFilesToWebpack function of the afterCompile.ts file.

Possibly worth investigating what compilation.compiler.context is these days - I’ve an idea it may have changed with webpack 4 but I’m not certain.

Also worth checking: when did this functionality stop working? Which version of ts-loader first presents the problem?

Would someone like to supply a minimal repro repo and investigate this?

That sounds terrible, but maybe we are getting close to a solution. If you move the project to a different directory you just have the bug again, except this time it can leak outside the project. However, if the depth of the project was detected programmatically and the outDir corrected automatically that would solve the issue.

On Sun, Sep 4, 2016, 16:25 Shubhendu Shekhar Singh notifications@github.com wrote:

Workaround for now is give path as “outDir”: “…/…/…/…/lib”

Number of backslashes = directory depth from root (/) till your project

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/TypeStrong/ts-loader/issues/190#issuecomment-244626621, or mute the thread https://github.com/notifications/unsubscribe-auth/AAUXacKtj-MilMUtXzGUbk5S4b1nDq0Rks5qmylRgaJpZM4ITZ-J .

Yep, seeing this too. Stuck on 0.8.1 for now (really wish I could comment package.json but oh well)

So I did some further testing. It turned out I can do this but I needed to create a tsconfig.build.json specifically for my build and pass it to the loader. Also outDir needs to be ./ or it will be appended to the output folder from webpack.

In 0.8.2 this is definitely broken though, it expands the full original root path for each d.ts file it outputs.