Ts-loader: Typescript emitted no output

[SuperDJ]

Expected Behaviour

Get compiled js from ts

Actual Behaviour

Getting the following error:

Module build failed: Error: Typescript emitted no output for C:xampphtdocsnode-apisrcjsserver.ts.
at successLoader (C:xampphtdocsnode-apinode_modulests-loaderdistindex.js:39:15)
at Object.loader (C:xampphtdocsnode-apinode_modulests-loaderdistindex.js:21:12)
at eval (webpack:///./src/js/server.ts?:1:7)
at Object../src/js/server.ts (C:xampphtdocsnode-apidistjsserver.js:81:1)
at __webpack_require__ (C:xampphtdocsnode-apidistjsserver.js:20:30)
at C:xampphtdocsnode-apidistjsserver.js:69:18
at Object. (C:xampphtdocsnode-apidistjsserver.js:72:10)
at Module._compile (module.js:652:30)
at Object.Module._extensions..js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)

Steps to Reproduce the Problem

Use npm run dev in the repository below. Or use the following config files:

Webpack:

const path = require( 'path' ),
    CleanWebpackPlugin = require( 'clean-webpack-plugin' );

module.exports = env => {
    return {
        mode: env.dev ? 'development' : 'production',
        entry: {
            'server': './src/js/server.ts'
        },
        output: {
            path: __dirname,
            filename: './dist/js/[name].js',
        },
        externals: '/node_modules',
        module: {
            rules: [
                {
                    test: /\.js$/,
                    exclude: ['/node_modules/', '/src/scss/'],
                    use: [
                        'babel-loader'
                    ]
                },
                {
                    test: /\.ts(x?)$/,
                    exclude: ['/node_modules/', '/src/scss/'],
                    use: [
                        'babel-loader',
                        'ts-loader',
                    ]
                },
                {
                    test:  /\.json$/,
                    loader: 'json-loader'
                },
            ]
        },
        resolve: {
            extensions: ['.js', '.ts', '.tsx'],
            alias: {
                '@': path.resolve(__dirname, './src/js')
            }
        },
        plugins: [
            new CleanWebpackPlugin(['./dist/js', './dist/css']),
        ]
    }
};

Typescript:

{
    "compilerOptions": {
        "removeComments": true,
        "preserveConstEnums": true,
        "allowJs": true,
        "outDir": "./dist/js",
        "target": "es5",
        "moduleResolution": "node",
        "module": "es2015",
        "lib": [
            "es2015",
            "es2016"
        ]
    },
    "exclude": [
        "./node_modules"
    ]
}

Babel:

{
    "presets": [
        [
            "env", {
                "targets": {
                    "node": "current"
                }
            }
        ],
        "stage-2",
        "es2015"
    ],
    "plugins": ["dynamic-import-node"]
}

Location of a Minimal Repository that Demonstrates the Issue.

https://github.com/SuperDJ/node-api

[johnnyreilly]

I'm afraid I don't have time to look at your setup. However I'm fairly sure there isn't an issue with ts-loader. It might be worth comparing your setup with this: https://github.com/johnnyreilly/reactspike

This is a universal react app that uses webpack with node successfully. Hope that helps.

[SuperDJ]

@johnnyreilly Could it also be related to a file that is being compiled? I mean the config has worked before but stopped working after I changed a file from .js to .ts. Specifically server.ts

[amiiit]

@SuperDJ were you able to solve the issue? I'm hitting on something similar, also when refactoring a JS module to TS

[SuperDJ]

@amiiit it's hard to tell. I haven't looked at since. But I just run a build for the repo and I'm getting errors so also no output.

[amiiit]

@SuperDJ and anyone else that might wonder, I found my error and it was ridiculously stupid: Apparently I was running tsc on my project before and so I was having some stale .js files next to the typescript files. Now ts-loader resolved the stale JS files which did not contain my new exported stuff, which resulted in the error above.

After banging my head for about a day and a half I realised this, deleted the stale .js files and it was all working again as expected. Hopefully this saves others from wasting their time like I did mine.

[amiiit]

@johnnyreilly I think this can be safely closed

[johnnyreilly]

Thanks!

[ChuckJonas]

I ran into this error when I had "noEmit": true, in my tsconfig.json

[chenendian]

@amiiit you meaning is .js and .ts can't exist in a project at the same time? now i use .js and ts in a project has error

[vocoWone]

Upgrade ts-loader.

[eric-burel]

For lost googlers: noEmit: true mistake can happen when easily when you try to reuse a Next.js TypeScript config. Next do not need to actually emit the JS file and uses the tsconfig internally.
But if you try to reuse your base config for external tooling, eg Storybook, building a server and so on, don't forget to add noEmit: false to the extended config.

[Igna07]

i have the same error, i'm trying to compile my .tsx file from node_module.

{ test: /\.tsx$/, include: [ paths.appNodeModules ], use: [ { loader: require.resolve('ts-loader'), options: { allowTsInNodeModules: true } } ] }
and i got this error in my terminal
Error: TypeScript emitted no output for C:\docker-environment\dockerized-ecp\application\DT\code\react-base-env-wp\node_modules\@dri\core\components\header.component.tsx.

[Myzel394]

I had the same problem even with "noEmit": true. What worked for me was to remove the test: /\.jsx?$/ rule completely from my webpack.config.js.