webpack / webpack-dev-server

Serves a webpack app. Updates the browser on changes. Documentation https://webpack.js.org/configuration/dev-server/.
MIT License
7.76k stars 1.43k forks source link

Application not found (127.0.0.1:8080) #1814

Closed jonathanlinat closed 5 years ago

jonathanlinat commented 5 years ago

Code

const path = require('path')
const TerserPlugin = require('terser-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
const HtmlWebPackPlugin = require('html-webpack-plugin')
const CleanWebpackPlugin = require('clean-webpack-plugin')
const webpack = require('webpack')

module.exports = (env, options) => {
  const isProductionMode = (options.mode === 'production')

  const src = path.resolve(__dirname, 'src')
  const dist = path.resolve(__dirname, 'dist')

  let webpackConfig = {
    entry: {
      app: [
        path.resolve(__dirname, `${src}/simulation.js`),
        path.resolve(__dirname, `${src}/simulation.css`),
        path.resolve(__dirname, `${src}/simulation.html`)
      ]
    },
    output: {
      path: path.resolve(__dirname, dist)
    },
    resolve: {
      alias: {
        Modules: path.resolve(__dirname, `${src}/modules`)
      }
    },
    devServer: {
      host: '127.0.0.1',
      open: true,
      hot: true
    },
    plugins: [
      new CleanWebpackPlugin(),
      new MiniCssExtractPlugin(),
      new HtmlWebPackPlugin({ template: `${src}/simulation.html` }),
      new webpack.NamedModulesPlugin(),
      new webpack.HotModuleReplacementPlugin()
    ],
    module: {
      rules: [
        { enforce: 'pre', test: /\.js$/, exclude: /node_modules/, loader: 'eslint-loader' },
        { test: /\.js$/, exclude: /node_modules/, use: { loader: 'babel-loader', options: { babelrc: false } } },
        { test: /\.css$/, use: [ isProductionMode ? MiniCssExtractPlugin.loader : 'style-loader', 'css-loader' ] },
        { test: /\.html$/, use: 'html-loader' }
      ]
    }
  }

  return webpackConfig
}

Expected Behavior

Open a new tab in my default Internet browser without any error.

Actual Behavior

Webpack doesn't open a new tab on compiling and a window popup appears telling me that the application hasn't been found.

It is still possible to access the localhost manually.

For Bugs; How can we reproduce the behavior?

Windows 10 + Brave Browser + Open option in true. This is the repository: https://github.com/jonathanlinat/es6-retrogaming-series-pong

Capture

alexander-akait commented 5 years ago

You should setup browser name, your os can't have default known browser

alexander-akait commented 5 years ago

Also you don't need new webpack.HotModuleReplacementPlugin() anymore

jonathanlinat commented 5 years ago

Well... I reinstalled Brave browser, reassigned it as my default known browser and deleted new webpack.HotModuleReplacementPlugin(). That's it. Thanks @evilebottnawi