Rise and Fall of WebPack Dev Server in My Project
Disclaimer: This is a log of my journey developing an electron app.
I’m working at a small electron app and I was experimenting with
webpack-dev-server, so I can try to do live reloads. First, I’ve started the app as a web app (no electron dependencies whatsoever). At this stage, running:
cross-env NODE_ENV=development IS_ELECTRON=1 webpack-dev-server
npm run would allow me to load and reload every time I did a change. Perfect solution I thought and I started to add electron via a simple app. The idea was to load the scripts off a file in production or the server in development. I used:
const script = document.createElement('script');
const port = process.env.PORT || 3000;
script.src = (process.env.HOT)
? 'http://localhost:' + port + '/main.js'
in my HTML document to make the choice. It worked in the sense that it was seeking the right resource, but… I ended up with load errors, in particular:
Uncaught SyntaxError: The URL’s scheme must be either ‘http:’ or ‘https:’. ‘file:’ is not allowed.
Then I found out
webpack-dev-server doesn’t like if the HTML source is a file :(.
Back to the drawing board I guess :)
A little experiment: If you find this post and ad below useful, please check the ad out :-)