Module build failed: Typescript emitted no output

[vincentsels]

npm install finished fine, but when trying to run through npm start I get the following output & error:

$ npm start

> [email protected] start C:\Projects\test\react-transform-boilerplate-ts
> node devServer.js

Listening at http://localhost:3000
ts-loader: Using [email protected] and C:\Projects\test\react-transform-boilerplate-ts\tsconfig.json
webpack built 0c31ff3a8e31e15d56c5 in 1841ms
Hash: 0c31ff3a8e31e15d56c5
Version: webpack 1.12.14
Time: 1841ms
    Asset     Size  Chunks       Chunk Names
bundle.js  99.3 kB       0       main
chunk    {0} bundle.js (main) 73.1 kB [rendered]
    [0] multi main 40 bytes {0} [built] [1 error]
    [1] (webpack)-hot-middleware/client.js 4.18 kB {0} [built]
    [2] (webpack)/buildin/module.js 251 bytes {0} [built]
    [3] ./~/strip-ansi/index.js 161 bytes {0} [built]
    [4] ./~/ansi-regex/index.js 135 bytes {0} [built]
    [5] (webpack)-hot-middleware/client-overlay.js 1.73 kB {0} [built]
    [6] ./~/ansi-html/index.js 4.02 kB {0} [built]
    [7] ./~/html-entities/index.js 231 bytes {0} [built]
    [8] ./~/html-entities/lib/xml-entities.js 2.98 kB {0} [built]
    [9] ./~/html-entities/lib/html4-entities.js 6.57 kB {0} [built]
   [10] ./~/html-entities/lib/html5-entities.js 49 kB {0} [built]
   [11] (webpack)-hot-middleware/process-update.js 3.88 kB {0} [built]

ERROR in ./src/index.tsx
Module build failed: Error: Typescript emitted no output for C:\Projects\test\react-transform-boilerplate-ts\src\index.tsx
    at Object.loader (C:\Projects\test\react-transform-boilerplate-ts\node_modules\ts-loader\index.js:421:15)
 @ multi main

[svdoever]

Same here... did you manage to solve this issue?

[svdoever]

Found the solution, probably issue with newer versions of TypeScript (i.e. 1.8.1):

Form the file tsconfig.json:

{
"compilerOptions": {
    "target": "ES6",
    "jsx": "react",
    "noEmit": true
},
"exclude": [
    "node_modules",
    "dev_server.js"
]
}

Remove the line "noEmit": true.

Thanks to: https://github.com/keokilee/react-typescript-boilerplate/issues/158

[ottonascarella]

I have found a post on stack overflow that solves the problem: http://stackoverflow.com/questions/37895944/react-transform-catch-errors-does-not-look-like-a-react-component

still, it should work without this versioning problem...

[byxor]

@svdoever react-scripts start will run the typescript compiler and overwrite tsconfig.json.

> react-scripts start

The following changes are being made to your tsconfig.json file:
  - compilerOptions.noEmit must be true
  - compilerOptions.jsx must be preserve (JSX is compiled by Babel)

Your solution works, but react-scripts undoes it automatically. ☹️

[svdoever]

@byxor I noticed as well that react-scripts started to modify the tsconfig.json, but in another context. Not good:-( This project is so long ago, I have no clue what it was all about... sorry...

[byxor]

@svdoever No worries! I made a workaround by creating separate tsconfig.json files for production/dev builds (tsconfig.production.json and tsconfig.development.json) and conditionally copying them into the project root before building.

I can elaborate further on this if anybody else is suffering from the same issue.

Edit: Here's a github issue where I've discussed my solution in a bit more depth.

[borm]

@svdoever react-scripts start will run the typescript compiler and overwrite tsconfig.json.

on webpack config

module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: [
          {
            loader: 'ts-loader',
            options: {
              compilerOptions: {
                noEmit: false,
              },
            },
          },
        ],