Support for tsx as entry file

[Raathigesh]

Thank you for this excellent project.
Is there any guide on how to configure a React project with typescript with electron-webpack?

[Raathigesh]

I suppose I have to modify the webpack config through electronWebpack configuration. Should have read the instructions. Closing this for now. Please let me know if there is an easy way out without modifying the webpack config.

[develar]

We do support tsx file extension. What error do you have? Have you installed TypeScript add-on?

[resir014]

Hey @develar, I'm having this issue as well.

I want to set my renderer entry point as index.tsx since I'm using TypeScript with React, but unfortunately it's not included in this line And TypeScript won't recognise JSX-enabled TypeScript files unless it has a .ts extension...

And yeah, I have followed all the TypeScript instructions.

EDIT: Before I forgot, here's the error I got:

┏ Renderer -------------------

  Error: Cannot find entry file src\renderer\index.ts (or .js)
      at C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\electron-webpack\src\main.ts:319:11
  From previous event:
      at computeEntryFile (C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\electron-webpack\out\main.js:107:22)
      at C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\electron-webpack\src\main.ts:207:35
  From previous event:
      at WebpackConfigurator.configure (C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\electron-webpack\out\main.js:377:11)
      at C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\electron-webpack\src\main.ts:312:31
      at Generator.next (<anonymous>)
      at runCallback (timers.js:785:20)
      at tryOnImmediate (timers.js:747:5)
      at processImmediate [as _immediateCallback] (timers.js:718:5)
  From previous event:
      at configure (C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\electron-webpack\out\main.js:93:22)
      at Object.getRendererConfiguration (C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\electron-webpack\src\main.ts:30:10)
      at module.exports.env (C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\electron-webpack\webpack.renderer.config.js:1:47)
      at handleFunction (C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\webpack\lib\prepareOptions.js:26:13)
      at prepareOptions (C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\webpack\lib\prepareOptions.js:11:13)
      at requireConfig (C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\webpack\bin\convert-argv.js:98:14)
      at C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\webpack\bin\convert-argv.js:104:17
      at Array.forEach (<anonymous>)
      at module.exports (C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\webpack\bin\convert-argv.js:102:15)
      at Object.<anonymous> (C:\Users\Resi\Projects\electron-webpack-quick-start-master\node_modules\webpack-dev-server\bin\webpack-dev-server.js:224:50)
      at Module._compile (module.js:624:30)
      at Object.Module._extensions..js (module.js:635:10)
      at Module.load (module.js:545:32)
      at tryModuleLoad (module.js:508:12)
      at Function.Module._load (module.js:500:3)
      at Function.Module.runMain (module.js:665:10)
      at startup (bootstrap_node.js:187:16)
      at bootstrap_node.js:608:3

┗ ----------------------------

[resir014]

@develar Actually, I just found a weird workaround that works:

Have your actual app entry point at a different filename, something like app.tsx, and on your app's index.ts file, simply include this:

import './app'

And tsconfig:

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

[knpwrs]

I'm experiencing this same issue and thought of making an index.ts to point at app.tsx but I don't really consider that to be a solution. @develar is there any chance of getting support for tsx entry files? I see the extraEntries option for the main process, but this isn't "extra" and I want to do this in the renderer process.

[resir014]

@knpwrd This is already fixed. Try renaming your entry point to index.tsx

[ChrisEdgington]

I started a project with your current release - 2.0.1. Everything worked great until I followed instructions for adding typescript support. That worked fine until I went to convert my .jsx files to .tsx, and then I received errors in the build. The errors were resolved by adding the jsx:react option to the tsconfig.json as documented above. Therefore, I created a branch that adds this to the documentation.

[ChrisEdgington]

How should I go about getting this PR'ed ... should this issue be reopened, should I create a new issue? FWIW - here is my branch with the doc change: https://github.com/ChrisEdgington/electron-webpack/tree/document-typescript-jsx-support