webpack
webpack copied to clipboard
webpack-dev-server fails if `#` in project path
Bug report
If you run the npx webpack serve on a project whose path contains a # character, then webpack-dev-server will fail to serve the content.
Actual Behavior
Here are some error logs:
~/projects/f#/webpack 07:57:20
❯ npx webpack serve
<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:8080/
<i> [webpack-dev-server] On Your Network (IPv4): http://192.168.1.225:8080/
<i> [webpack-dev-server] On Your Network (IPv6): http://[fe80::c3db:1547:cf82:8d44]:8080/
<i> [webpack-dev-server] Content not from webpack is served from '/home/felix/projects/f#/webpack/public' directory
assets by status 87.9 KiB [cached] 1 asset
runtime modules 27.1 KiB 12 modules
cacheable modules 551 KiB
modules by path ../../f#/webpack/node_modules/webpack/hot/*.js 4.59 KiB
../../f#/webpack/node_modules/webpack/hot/dev-server.js 1.88 KiB [built] [code generated]
../../f#/webpack/node_modules/webpack/hot/log.js 1.34 KiB [built] [code generated]
../../f#/webpack/node_modules/webpack/hot/log-apply-result.js 1.29 KiB [built] [code generated]
../../f#/webpack/node_modules/webpack/hot/emitter.js 75 bytes [built] [code generated]
../../f#/webpack/src/index.js 217 bytes [built] [code generated]
../../f#/webpack/node_modules/lodash/lodash.js 531 KiB [built] [code generated]
../../f#/webpack/node_modules/events/events.js 14.5 KiB [built] [code generated]
WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value.
Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/
ERROR in Module not found: Error: Can't resolve '/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true' in '/home/felix/projects/f#/webpack'
resolve '/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true' in '/home/felix/projects/f#/webpack'
using description file: /home/felix/projects/f#/webpack/package.json (relative path: .)
Field 'browser' doesn't contain a valid alias configuration
root path /home/felix/projects/f#/webpack
using description file: /home/felix/projects/f#/webpack/package.json (relative path: ./home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true)
no extension
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true.js doesn't exist
.json
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true.json doesn't exist
.wasm
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true.wasm doesn't exist
as directory
/home/felix/projects/f#/webpack/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true doesn't exist
using description file: /home/felix/projects/f#/webpack/node_modules/webpack-dev-server/package.json (relative path: ./client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true)
no extension
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true.js doesn't exist
.json
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true.json doesn't exist
.wasm
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true.wasm doesn't exist
as directory
/home/felix/projects/f#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true doesn't exist
using description file: /home/felix/projects/f#/webpack/package.json (relative path: .)
Field 'browser' doesn't contain a valid alias configuration
root path /home/felix/projects/f#/webpack
using description file: /home/felix/projects/f#/webpack/package.json (relative path: ./home/felix/projects/f)
no extension
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/home/felix/projects/f doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/home/felix/projects/f.js doesn't exist
.json
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/home/felix/projects/f.json doesn't exist
.wasm
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f#/webpack/home/felix/projects/f.wasm doesn't exist
as directory
/home/felix/projects/f#/webpack/home/felix/projects/f doesn't exist
No description file found in /home/felix/projects or above
no extension
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f.js doesn't exist
.json
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f.json doesn't exist
.wasm
Field 'browser' doesn't contain a valid alias configuration
/home/felix/projects/f.wasm doesn't exist
as directory
/home/felix/projects/f doesn't exist
webpack 5.75.0 compiled with 1 error and 1 warning in 2701 ms
^C<i> [webpack-dev-server] Gracefully shutting down. To force exit, press ^C again. Please wait...
Expected Behavior
The server should run regardless of the characters in the folder path.
How Do We Reproduce?
Here is a minimal project that can trigger this behavior.
This script should reproduce the behavior if you are using something POXIX-y.
mkdir "test#"
tar -xzvf webpack.tar.gz -C "test#"
cd "test#/webpack"
npx webpack serve
System: OS: Linux 5.10 Debian GNU/Linux 11 (bullseye) 11 (bullseye) CPU: (4) x64 Intel(R) Core(TM) i7-6600U CPU @ 2.60GHz Memory: 8.45 GB / 15.31 GB Binaries: Node: 16.19.1 - ~/.asdf/installs/nodejs/16.19.1/bin/node npm: 9.6.0 - ~/.asdf/plugins/nodejs/shims/npm Browsers: Chrome: 106.0.5249.119 Firefox: 102.8.0esr Packages: webpack: ^5.75.0 => 5.75.0 webpack-cli: ^5.0.1 => 5.0.1 webpack-dev-server: ^4.11.1 => 4.11.1
thanks so much
Reproducible example (code from dev server):
const additionalEntry = [
'/home/akait/IdeaProjects/webpack-cli/test#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true',
'/home/akait/IdeaProjects/webpack-cli/test#/webpack/node_modules/webpack/hot/dev-server.js'
];
if (typeof webpack.EntryPlugin !== "undefined") {
for (const additionalEntry of additionalEntries) {
new webpack.EntryPlugin(compiler.context, additionalEntry, {
name: undefined,
}).apply(compiler);
}
}
And the problem in '/home/akait/IdeaProjects/webpack-cli/test#/webpack/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=8080&pathname=%2Fws&logging=info&overlay=true&reconnect=10&hot=true&live-reload=true', if we remove all after ?... we will not have the problem, so I think we have a problem in our resolver, somwhere here https://github.com/webpack/enhanced-resolve/blob/main/lib/util/identifier.js
@vankop Hello, can you give an advice here, I feel like we don't resolve it valid way
yeah looks like we reverted this https://github.com/webpack/enhanced-resolve/pull/244 unsure why..
I would still consider this as a webpack limitation since webpack treat file path as url path ( with # and ? as a "special" chars )
@vankop I tried to use file:// but it doesn't work, maybe we can fix this limitation using file://, so file:// will always parsered and handled as URL without any limitations
And it should not break nothing (I hope :smile: )
This issue had no activity for at least three months.
It's subject to automatic issue closing if there is no activity in the next 15 days.
bump
Issue was closed because of inactivity.
If you think this is still a valid issue, please file a new issue with additional information.