Webpack запрашивает неправильный порт прокси - PullRequest
Новая
       10

Webpack запрашивает неправильный порт прокси

0 голосов
/ 11 октября 2019

Я пытаюсь создать интерфейс React для использования API Django. Я использую Webpack и Webpack Dev Server, но он не запрашивает порт прокси-сервера, на который я ему сообщаю. Фактически, он всегда запрашивает указанный порт переднего плана или, если я не указываю, порт по умолчанию. Я даже пытался жестко кодировать http://localhost:8000/feed/ в запросе GET, чтобы увидеть, что произойдет, и ответ - ничего. Я использую Webpack 4.8.3 и Webpack Dev Server 3.7.2 - обе версии, которые я использовал ранее с React и Django, и у меня не было проблем.

Вот часть моего кода:

webpack.config.js 

const path = require("path");
const webpack = require("webpack");

const HtmlWebpackPlugin = require("html-webpack-plugin");
const HtmlWebpack = new HtmlWebpackPlugin({
  template: "src/index.html",
  filename: "index.html",
  inject: "body"
});

const CopyWebpackPlugin = require("copy-webpack-plugin");
const CopyWebpack = new CopyWebpackPlugin([
  { from: "./src/assets", to: "assets" }
]);

const HotModuleReplcement = new webpack.HotModuleReplacementPlugin();

module.exports = {
  entry: "./src/app.js",
  output: {
    path: path.resolve("public"),
    filename: "app.js",
    publicPath: "/"
  },
  module: {
    rules: [
      { test: /\.jsx?$/, loader: "babel-loader", exclude: /node_modules/ },
      { test: /\.css$/, loader: ["style-loader", "css-loader"] },
      {
        test: /\.scss$/,
        loader: ["style-loader", "css-loader", "sass-loader"]
      },
      { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file-loader" },
      { test: /\.(woff|woff2)$/, loader: "url-loader?prefix=font/&limit=5000" },
      {
        test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
        loader: "url-loader?limit=10000&mimetype=application/octet-stream"
      }
    ]
  },
  devServer: {
    historyApiFallback: true,
    hot: true,
    inline: true,
    open: true,
    port: 8080,
    proxy: {
      "**": {
        target: "http://[::1]:8000",
        secure: false,
        changeOrigin: true
      }
    }
  },
  plugins: [HotModuleReplcement, HtmlWebpack, CopyWebpack]
};

Запрос GET, который вызывается в componentDidMount его компонента: 

getSubmissions() {
        fetch('feed/', {
            method: 'GET',
            headers: {
                'Content-Type': 'application/json'
            }
        })
            .then((res) => this.setState({ submissions: res.data }))
            .catch((err) => console.log(err))
    }

Сценарии Package.json: 

"scripts": {
    "start": "webpack-dev-server --port 8080",
    "build": "webpack -p"
  }

Я также довольно много погуглил и попробовал много разных решений, которые не имели значения. Например, я попробовал те, что на этой странице уже>> 1015 *https://github.com/webpack/webpack-dev-server/issues/793

...