Skip to content

fix(serve): do not default port in webpack-dev-server v4 #2126

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Nov 24, 2020
Merged

fix(serve): do not default port in webpack-dev-server v4 #2126

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
90f2548
refactor(serve): move devServer version to startDevServer
ylemkimon Nov 20, 2020
1b3b16a
fix(serve): do not default port in devServer v4
ylemkimon Nov 20, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 13 additions & 4 deletions packages/serve/__tests__/createConfig.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,14 +8,14 @@ describe('createConfig', () => {
hot: true,
openPage: 'main',
};
expect(createConfig(args)).toEqual(args);
expect(createConfig(args, false)).toEqual(args);
});

it('sets client object using clientLogging argument', () => {
const args = {
clientLogging: 'verbose',
};
expect(createConfig(args)).toEqual({
expect(createConfig(args, false)).toEqual({
client: {
logging: 'verbose',
},
Expand All @@ -26,17 +26,26 @@ describe('createConfig', () => {
const args = {
hotOnly: true,
};
expect(createConfig(args)).toEqual({
expect(createConfig(args, false)).toEqual({
hotOnly: true,
});
});

it('sets hot using hotOnly argument with devServer 4', () => {
const args = {
hotOnly: true,
};
expect(createConfig(args, true)).toEqual({
hot: 'only',
});
});

it('overrides hot with hotOnly', () => {
const args = {
hot: true,
hotOnly: true,
};
expect(createConfig(args)).toEqual({
expect(createConfig(args, false)).toEqual({
hot: true,
hotOnly: true,
});
Expand Down
17 changes: 2 additions & 15 deletions packages/serve/src/createConfig.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,29 +1,16 @@
import { utils } from 'webpack-cli';

import { devServerOptionsType } from './types';

const { logger } = utils;

/**
*
* Creates a devServer config from CLI args
*
* @param {Object} args - devServer args
* @param {boolean} isDevServer4 - is devServer v4
*
* @returns {Object} valid devServer options object
*/
export default function createConfig(args): devServerOptionsType {
export default function createConfig(args, isDevServer4): devServerOptionsType {
const options = { ...args };
let isDevServer4 = false,
devServerVersion;
try {
// eslint-disable-next-line node/no-extraneous-require
devServerVersion = require('webpack-dev-server/package.json').version;
} catch (err) {
logger.error(`You need to install 'webpack-dev-server' for running 'webpack serve'.\n${err}`);
process.exit(2);
}
isDevServer4 = devServerVersion.startsWith('4');

if (options.clientLogging) {
options.client = {
Expand Down
29 changes: 20 additions & 9 deletions packages/serve/src/startDevServer.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,15 +16,21 @@ const { logger } = utils;
* @returns {Object[]} array of resulting servers
*/
export default function startDevServer(compiler, devServerArgs): object[] {
let Server;
let isDevServer4 = false,
devServerVersion,
Server;
try {
// eslint-disable-next-line node/no-extraneous-require
devServerVersion = require('webpack-dev-server/package.json').version;
// eslint-disable-next-line node/no-extraneous-require
Server = require('webpack-dev-server/lib/Server');
} catch (err) {
logger.error(`You need to install 'webpack-dev-server' for running 'webpack serve'.\n${err}`);
process.exit(2);
}
const cliOptions = createConfig(devServerArgs);
isDevServer4 = devServerVersion.startsWith('4');

const cliOptions = createConfig(devServerArgs, isDevServer4);
const devServerOptions = getDevServerOptions(compiler);

const servers = [];
Expand All @@ -33,16 +39,21 @@ export default function startDevServer(compiler, devServerArgs): object[] {
devServerOptions.forEach((devServerOpts): void => {
const options = mergeOptions(cliOptions, devServerOpts);
options.host = options.host || 'localhost';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ylemkimon I think we have a problem here too, I think we used 0.0.0.0 by default here, we should use the same logic as used in Node.js http/https module

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

But let's solve this in other PR

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changing the default hostname would be a breaking change for webpack-cli.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's do it only for v4

Copy link
Contributor Author

@ylemkimon ylemkimon Nov 24, 2020 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think it's better done on the dev-server's side.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually the default host was localhost in the webpack-dev-server CLI: https://github.com/webpack/webpack-dev-server/blob/4ab1f21bc85cc1695255c739160ad00dc14375f1/bin/options.js#L175

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, but I think it is bug and we should fix it, ideally we should be like

const http = require('http');

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end('Hello, World!');
}

const server = http.createServer(requestListener);
server.listen(8080);

console.log(server.address())

:: for IPv6
0.0.0.0 for IPv4

options.port = options.port || 8080;
// devSever v4 handles the default port itself
if (!isDevServer4) {
options.port = options.port || 8080;
}

const portNum = +options.port;
if (options.port) {
const portNum = +options.port;

if (usedPorts.find((port) => portNum === port)) {
throw new Error(
'Unique ports must be specified for each devServer option in your webpack configuration. Alternatively, run only 1 devServer config using the --config-name flag to specify your desired config.',
);
if (usedPorts.find((port) => portNum === port)) {
throw new Error(
'Unique ports must be specified for each devServer option in your webpack configuration. Alternatively, run only 1 devServer config using the --config-name flag to specify your desired config.',
);
}
usedPorts.push(portNum);
}
usedPorts.push(portNum);

const server = new Server(compiler, options);
server.listen(options.port, options.host, (err): void => {
Expand Down