symfony / webpack-encore

A simple but powerful API for processing & compiling assets built around Webpack
https://symfony.com/doc/current/frontend.html
MIT License
2.23k stars 197 forks source link

dev-server default port is not added any more #565

Open bravik opened 5 years ago

bravik commented 5 years ago

This week something did updated, and I have Cross-Origin request errors for GET /sockjs-node/info requests flooding the console and preventing auto-reloading on changes.

I have in package.json: "start": "encore dev-server --disableHostCheck", and commit this file to repository, so I could easily start dev-server with npm start on any deployment and not specify particular host. But obviously --disableHostCheck flag doesn't work anymore.

Furthermore, when I add --host myhost.loc GET /sockjs-node/info return 404 errors.

Kocal commented 5 years ago

I'm not sure arguments can be passed in camel case, normally we pass --disable-host-check.

See more at https://webpack.js.org/configuration/dev-server/#devserverdisablehostcheck

bravik commented 5 years ago

Oh, I've noticed that on another project, where I yet not updated dependencies such requests are fired: http://localhost:8080/sockjs-node/info?t=1555305759521 and on updated: http://localhost/ru/sockjs-node/info?t=1555305986261 Without port. Before it always added the correct default port automatically. Now if I add --port 8080 it all works again.

Lyrkan commented 5 years ago

Hi @bravik,

I did a quick test and it seems to work fine with the latest version of Encore and its dependencies:

Command URL
yarn encore dev-server image
yarn encore dev-server --host dev.local image
encore dev-server --host dev.local --port 9090 image

Wouldn't you happen to have something in your webpack.config.js that could be the cause of the issue?

x1oJ0 commented 5 years ago

Hey @Lyrkan I have same problem. I just updated the package to version 0.27.0 and got error with sockjs. At the moment we use command like this: encore dev-server --host 0.0.0.0 --port 41781 --disable-host-check --hot

All assets are server with right port and works: <link rel="stylesheet" href="http://0.0.0.0:41781/build/grid.css">

But sockjs is served with host and port like this: http://localhost:41700/sockjs-node/info?t=1555323988872

Any idea why?

x1oJ0 commented 5 years ago

@Lyrkan Also tried to locate the URL and under http://localhost:41781/sockjs-node/info?t=1555326602938 is sockjs available. So there is problem with assigning the right port. It uses 41700 instead of 41781. And I can't see why...

bravik commented 5 years ago

@Lyrkan nothing special. Actually I've done no changes to webpack.config.js at all. Just npm update for encore 0.27. However the same thing happen after npm update with encore 0.26. So it might not be something with encore, but some dependency.

x1oJ0 commented 5 years ago

@Lyrkan, @bravik yep same for me. Probably problem with webpack dev-server and port assigning?

x1oJ0 commented 5 years ago

@Lyrkan okay si I reverted webpack-dev-server to version 3.2.0 and everything works now. So it's problem on their side.. :/ They should fix handling with sockjs port. Or is there any other configuration what we need to set?

It's in here: https://github.com/webpack/webpack-dev-server/issues/1777

Lyrkan commented 5 years ago

Oh, so that only happens when you are retrieving assets from the dev-server in a page that isn't handled by it? That would explain why I didn't see the issue during my previous test :)

Not much we can do on our side then (except maybe pinning the webpack-dev-server version to <3.3), but it'll probably be fixed quite soon anyway.

In the meantime, if you are using Yarn you can add a resolutions entry to your package.json in order to force it to use 3.2: https://yarnpkg.com/lang/en/docs/selective-version-resolutions/#toc-how-to-use-it

x1oJ0 commented 5 years ago

Yep, I installed specific version 3.2.0 on webpack-dev-server and it works now. So I think we can close this issue coz it's not a problem of encore. :)

Lyrkan commented 5 years ago

@bravik Does it also solve your issue?

bravik commented 5 years ago

@Lyrkan I've just added specific --port and it works for now.

zhangyuang commented 5 years ago

if you add --port the sockjs port will use port if you don't add the sockjs port will use location.port but now, you can use --sockPort to use the correct port look this pr

aarongerig commented 5 years ago

Seems to be an open issue on webpack-dev-server's end: https://github.com/webpack/webpack-dev-server/issues/1796

Lyrkan commented 5 years ago

@aarongerig Doesn't seem to be the same issue to me.

As pointed by @ondrajonas it was most likely related to https://github.com/webpack/webpack-dev-server/issues/1777 which should be fixed in the next version of webpack-dev-server.

lambertbeekhuis commented 5 years ago

Hey @Lyrkan, had the same problem when using Vue/Hot Module Reloading using version 0.27.: (CORS Access-Control-Allow-Origin)

Thanks to your comments solved it with running: yarn encore dev-server --port 8080 --disable-host-check --hot

or easier by adding the port and disable-host-check in package.json: "dev-server": "encore dev-server --port 8080 --disable-host-check" Now I can use the normal yarn dev-server --hot command again.

Thanks!

ElonLotfi commented 4 years ago

had the same problem , GET https://localhost:8700/sockjs-node/info?t=1585333912786 net::ERR_SSL_PROTOCOL_ERROR

chapterjason commented 4 years ago

Using --https and https://github.com/symfony/symfony-docs/pull/13746/files fixes the net::ERR_SSL_PROTOCOL_ERROR error for me.