can the server be remove from the boiler-plate and instead use webpack-dev-server

[AliasKingsWorth]

I wanted to remove the server folder from boilerplate and instead wanted to use the webpack-dev-server and wanted to make is as close to CRA as possible.

Description

I have tried to implement the webpack-dev-server everything compiles right. but nothing is displayed and a blank screen shows.

Steps to reproduce

replace the things as defined here: https://stackoverflow.com/questions/53066145/remove-server-from-react-boilerplate
"devDependencies": { "@babel/cli": "7.4.3", "@babel/core": "7.4.3", "@babel/plugin-proposal-class-properties": "7.4.0", "@babel/plugin-syntax-dynamic-import": "7.2.0", "@babel/plugin-transform-modules-commonjs": "7.4.3", "@babel/plugin-transform-react-constant-elements": "7.2.0", "@babel/plugin-transform-react-inline-elements": "7.2.0", "@babel/preset-env": "7.4.3", "@babel/preset-react": "7.0.0", "@babel/register": "7.4.0", "@webpack-cli/serve": "^1.6.0", "add-asset-html-webpack-plugin": "3.1.3", "babel-core": "7.0.0-bridge.0", "babel-eslint": "10.0.1", "babel-loader": "8.0.5", "babel-plugin-dynamic-import-node": "2.2.0", "babel-plugin-lodash": "3.3.4", "babel-plugin-react-intl": "3.0.1", "babel-plugin-styled-components": "1.10.0", "babel-plugin-transform-react-remove-prop-types": "0.4.24", "circular-dependency-plugin": "5.0.2", "compare-versions": "3.4.0", "compression-webpack-plugin": "2.0.0", "coveralls": "3.0.3", "css-loader": "2.1.1", "eslint": "5.16.0", "eslint-config-airbnb": "17.1.0", "eslint-config-airbnb-base": "13.1.0", "eslint-config-prettier": "4.1.0", "eslint-import-resolver-webpack": "0.11.1", "eslint-plugin-import": "2.17.2", "eslint-plugin-jsx-a11y": "6.2.1", "eslint-plugin-prettier": "3.0.1", "eslint-plugin-react": "7.12.4", "eslint-plugin-react-hooks": "1.6.0", "eslint-plugin-redux-saga": "1.0.0", "file-loader": "3.0.1", "html-loader": "0.5.5", "html-webpack-plugin": "3.2.0", "image-webpack-loader": "^4.6.0", "imports-loader": "0.8.0", "jest-cli": "24.7.1", "jest-dom": "3.1.3", "jest-styled-components": "6.3.1", "lint-staged": "8.1.5", "ngrok": "3.1.1", "node-plop": "0.18.0", "null-loader": "0.1.1", "offline-plugin": "5.0.6", "plop": "^2.7.4", "pre-commit": "1.2.2", "prettier": "1.17.0", "react-app-polyfill": "0.2.2", "react-hot-loader": "^3.1.3", "react-test-renderer": "16.8.6", "react-testing-library": "6.1.2", "rimraf": "2.6.3", "shelljs": "^0.8.4", "style-loader": "0.23.1", "stylelint": "10.0.1", "stylelint-config-recommended": "2.2.0", "stylelint-config-styled-components": "0.1.1", "stylelint-processor-styled-components": "1.6.0", "svg-url-loader": "2.3.2", "terser-webpack-plugin": "1.2.3", "url-loader": "1.1.2", "webpack": "4.30.0", "webpack-cli": "3.3.0", "webpack-dev-middleware": "3.6.2", "webpack-dev-server": "^3.11.3", "webpack-hot-middleware": "2.24.3", "webpack-inject-plugin": "^1.5.5", "webpack-pwa-manifest": "^4.3.0", "whatwg-fetch": "3.0.0" },

webpack.dev.babel
entry: [ require.resolve('react-app-polyfill/ie11'), 'react-hot-loader/patch',webpack-dev-server/client?http://localhost:3000/`,
'webpack/hot/only-dev-server',
path.join(process.cwd(), 'app/app.js'), // Start with js/app.js
],

// Don't use hashes in dev mode for better performance
output: {
filename: '[name].js',
chunkFilename: '[name].chunk.js',
publicPath: http://localhost:3000/,
},

optimization: {
splitChunks: {
chunks: 'all',
},
},

devServer: {
port: 3000,
publicPath: http://localhost:3000/,
compress: true,
noInfo: false,
stats: 'errors-only',
inline: true,
lazy: false,
hot: true,
open: true,
overlay: true,
contentBase: path.join(__dirname, '..', '..', 'app', 'build'),
watchOptions: {
aggregateTimeout: 300,
ignored: '/node_modules/',
poll: 100,
},
historyApiFallback: {
verbose: true,
disableDotRule: false,
},
},`

start script update:
"start": "cross-env NODE_ENV=development node --trace-warnings ./node_modules/webpack-dev-server/bin/webpack-dev-server --color --config internals/webpack/webpack.dev.babel.js",

Expected behavior
page should render as usal

Screenshots
If applicable, add screenshots to help explain your problem.

Versions

• webpack-dev-server: "^3.11.3",
• react-hot-loader: "^3.1.3",
• React-Boilerplate: 4.0.0
• Node/NPM: 12.18.0/6.14.4
• Browser: Mozilla Firefox