renderer: setup react-router and two routes #30
Conversation
bajtos
force-pushed
the
renderer--router
branch
2 times, most recently
from
74aa071
to
2de1610
Compare
bajtos
changed the title
Create two screens: Station Shell and Saturn Module. Signed-off-by: Miroslav Bajtoš <saturn@bajtos.net>
| @@ -29,7 +27,7 @@ module.exports = async function (ctx) { | |||
| let devServer | |||
|
|
|||
| if (app.isPackaged || process.env.NODE_ENV !== 'development') { | |||
| ui.loadURL(pathToFileURL(path.join(__dirname, '../renderer/dist/index.html')).toString()) | |||
| ctx.loadWebUIFromDist(ui) | |||
There was a problem hiding this comment.
@bajtos - what is the advantage of moving this into the context in index.js and using electron-serve?
There was a problem hiding this comment.
A great question!
When serving the UI from a file:// URL, routing does not work. I tried to switch to Hash based routing too (index.html#/somepath), but it didn't work either.
With electron-serve, we register a custom scheme app: and load the UI via "proper" URL app://-/.
See also https://www.npmjs.com/package/electron-serve:
Normally you would just use
win.loadURL('file://…'), but that doesn't work when you're making a single-page web app, which most Electron apps are today, ashistory.pushState()'ed URLs don't exist on disk. It serves files if they exist, and falls back toindex.htmlif not, which means you can use router modules likereact-router,vue-router, etc.
Create two screens: Station Shell and Saturn Module.
Connect to #18
Initial screen:
Saturn screen: