Render compile fails when the renderer entry ponit file is tsx.

vamseekm commented 6 years ago

src/renderer/main.tsx

import * as React from "react";                                                                                                                                                                                    
import * as ReactDOM from "react-dom";                                                                                                                                                                             

ReactDOM.render((<h1> I am react h1</h1>), document.getElementById("app"));

Error that I am getting:

ERROR in ./src/renderer/main.tsx 5:17
  Module parse failed: Unexpected token (5:17)
  You may need an appropriate loader to handle this file type.
  | 
  | 
  > ReactDOM.render((<h1> I am react h1</h1>), document.getElementById("app"));
  | 
   @ multi (webpack)-dev-server/client?http://localhost:9080 webpack/hot/dev-server css-hot-loader/hotModuleReplacement ./src/renderer/main.tsx

My package.json file

{
  "name": "efin",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "debug": "which electron",
    "dev": "electron-webpack dev"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@babel/preset-react": "^7.0.0-beta.51",
    "@types/console-stamp": "^0.2.31",
    "@types/knex": "^0.14.14",
    "@types/koa": "^2.0.46",
    "@types/koa-router": "^7.0.30",
    "@types/minimist": "^1.2.0",
    "@types/node": "^10.3.6",
    "@types/react": "^16.4.5",
    "@types/react-dom": "^16.0.6",
    "@types/react-router-dom": "^4.2.7",
    "console-stamp": "^0.2.6",
    "csv-parse": "^2.5.0",
    "electron": "^2.0.3",
    "electron-webpack": "^2.1.2",
    "electron-webpack-ts": "^2.0.2",
    "humanize": "0.0.9",
    "knex": "^0.14.6",
    "koa": "^2.5.1",
    "koa-router": "^7.4.0",
    "minimist": "^1.2.0",
    "murmurhash": "0.0.2",
    "mysql": "^2.15.0",
    "node-ini": "^1.0.0",
    "react": "^16.4.1",
    "react-dom": "^16.4.1",
    "react-hot-loader": "^4.0.0",
    "react-router-dom": "^4.3.1",
    "ts-node": "^7.0.0",
    "tslib": "^1.9.3",
    "typescript": "^2.9.2",
    "upstox": "^1.2.3",
    "webpack": "^4.14.0"
  }
}

My tsconfig.json file:

{
    "extends": "./node_modules/electron-webpack/tsconfig-base.json",
    "compilerOptions": {
        "jsx": "react"
    }
}

michalczaplinski commented 6 years ago

@ffiw Have you managed to resolve this / find a workaround or is this still an issue for you? (I'm facing the same problem it seems)

vamseekm commented 6 years ago

I wasn't able to resolve it. So ended up writing my own webpack config with hot reload.

michalczaplinski commented 6 years ago

All right, thanks for a quick reply :)

On 16 Jul 2018, at 13:53, ffiw notifications@github.com wrote:

I wasn't able to resolve it. So ended up writing my own webpack config with hot reload.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/electron-userland/electron-webpack/issues/171#issuecomment-405211209, or mute the thread https://github.com/notifications/unsubscribe-auth/AFKpMgib6xQSwTV83YOiZQbItDHa71rpks5uHHCRgaJpZM4U9T8L.

Glinkis commented 6 years ago

This is still an issue.

eranshmil commented 5 years ago

Working for me using the following versions:

    "electron": "3.0.10",
    "electron-builder": "^20.38.2",
    "electron-webpack": "^2.6.1",
    "electron-webpack-ts": "^3.1.0",
    "tslint": "^5.11.0",
    "typescript": "^3.2.1",
    "webpack": "^4.26.1",

erikjalevik commented 5 years ago

So this is an Electron version issue? I have the same problem, everything is up to date, except Electron, which is still on 2.0.2. Had planned on delaying that upgrade until a little later.

EDIT: Nope, just tried with Electron 4.0.0 and Typescript files are still not being compiled.

EDIT2: After rummaging around a bit more, deleting node_modules and the package-lock.json, I did get the TypeScript to compile but immediately ran into the next issue, being that my baseUrl didn't seem to have any effect. Think I'll have to bite the bullet and hand craft the webpack config.

twigs67 commented 4 years ago

same... can't get jsx/tsx to compile.

electron-userland / electron-webpack

Render compile fails when the renderer entry ponit file is tsx. #171