Comments (8)
@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"
}
}
from electron-webpack.
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.
from electron-webpack.
We do support tsx
file extension. What error do you have? Have you installed TypeScript add-on?
from electron-webpack.
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
┗ ----------------------------
from electron-webpack.
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.
from electron-webpack.
@knpwrd This is already fixed. Try renaming your entry point to index.tsx
from electron-webpack.
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.
from electron-webpack.
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
from electron-webpack.
Related Issues (20)
- Fail to transpile other js files next to src/main/index.js file HOT 4
- rendering react-router-dom hooks cause hooks rules error HOT 3
- Custom webpack config gets into infinite loop HOT 5
- Sentry integration not working HOT 10
- electron-webpack dev not works for flash plugin HOT 1
- Question: Devserver disable
- electron-webpack issue on --env.production parameter HOT 1
- electron 13.x HOT 6
- Images not showing up in output folder HOT 1
- CSS Error: Unexpected Token
- Can you push update so there was support of Webpack 5? HOT 5
- Adding tailwind to Electron-Webpack HOT 1
- electron-webpack doesn't recognize my loader HOT 3
- NAPI Addon How it works in electron-wepack HOT 1
- Recommended migration strategies? HOT 3
- map file not server by webpack-dev-server HOT 1
- Segmentation fault on Windows 11
- Electron cannot be found after packaging??? HOT 2
- Update expo from 49 to 50 blank white page.
- Can you provide an Example with npm?
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from electron-webpack.