Webpack-dev-server, кажется, работает, но я получаю «Этот сайт не доступен», когда я пытаюсь получить доступ к порту - PullRequest
0 голосов
/ 08 апреля 2020

Я пытаюсь настроить веб-пакет для работы с машинописью и рулем. Также я добавил webpack-dev-server, но он не работает. Он говорит, что все работает, но когда я go на localhost: 6000, я получаю This site can't be reached.

Вот мое дерево каталогов:

│   package.json
│   tsconfig.json
│   webpack.config.js 
│
├───dist 
│       bundle.js
│       bundle.js.map
│       index.html
│
└───src
        index.handlebars
        index.ts
        templates.d.ts

А вот webpack.config. js file

const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const webpack = require('webpack');
const path = require('path');

module.exports = {
  entry: './src/index.ts',
  devtool: 'source-map',
  devServer: {
    contentBase: path.resolve(__dirname, 'dist'),
    hot: true,
    host: '0.0.0.0',
    port: 6000,
    open: true
  },
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist'),
    publicPath: '/dist/'
  },
  resolve: {
    extensions: ['.ts', '.js' ]
  },
  plugins: [
    new webpack.LoaderOptionsPlugin({
      options: {
        handlebarsLoader: {}
      }
    }),
    new HtmlWebpackPlugin({
      title: 'My hometask',
      template: './src/index.handlebars'
    })
  ],
  module: {
    rules: [
      { 
        test: /\.js/,
        loader: 'babel',
        exclude: /(node_modules|bower_components)/
      },
      {
        test: /\.handlebars$/,
        loader: "handlebars-loader"
      },
      {
        test: /\.css$/i,
        use: [MiniCssExtractPlugin.loader, 'css-loader'],
      },
      {
        test: /\.ts?$/,
        use: 'ts-loader',
        exclude: /node_modules/,
      },
    ]
  }
};

Что с этим не так? Почему я не могу использовать dev-сервер?

1 Ответ

0 голосов
/ 08 апреля 2020

Я изменил порт на 4000, и он начал работать. Понятия не имею почему;)

...