可选信息:我正在尝试使用marty.js和webpack 开发服务器构建这个项目,允许入口点来自,允许来自react-router 的以便它不仅仅在 \ 路径中工作。
因此,我整天都在研究这个堆栈溢出答案,但我无法理解以下代码背后的逻辑以及为什么这个答案有效。
retozi 回答:
我设置了一个代理来实现这一点:
您有一个常规的快速网络服务器,它在任何 > 路由上为 index.html 提供服务,除非它是资产路由。如果它是资产,则请求被代理到 web-dev-server
您的 react hot 入口点仍将直接指向 webpack 开发服务器,因此热重载仍然有效。
假设您在 8081 上运行 webpack-dev-server,在 8080 上运行您的代理。
我的代码现在看起来像这样,但为了让它工作,我稍后需要实现marty-express。为了实现这一点,我必须首先了解 retonzis 的答案。
express.js 文件
要求
'use strict';
var express = require('express');
var path = require('path');
var logger = require('morgan');
var bodyParser = require('body-parser');
var config = require('../config.json');
var webpack = require('webpack');
var WebpackDevServer = require('webpack-dev-server');
var proxy = require('proxy-middleware');
var url = require('url');
代理人
var app = express(); //our express instance
// -------- my proxy----------------------
app.use('/assets', proxy(url.parse('http://localhost:8081/assets')));//but why do we need a proxy? This line really confuses me.
马丁特快**
我打算在理解这个例子后立即使用它,我只是希望它将反应路由传递给 express。**
//app.use(require('marty-express')({
// routes: require('../routes'),
// application: require('../application').Application
//}));
表达东西
app.get('/*', function(req, res) {
res.sendFile(__dirname + '/index.html');
});//if I got this straight this line just tells express to server my index.html file to all routes. My guess is this will be removed when I implement [marty-express][4].
2台服务器 webpack-dev-server 和 express
//----- my-webpack-dev-server------------------
var webpackServer = new WebpackDevServer(webpack(require('../../webpack.config')), {
contentBase: __dirname,
hot: true,
quiet: false,
noInfo: false,
publicPath: '/assets/',
stats: { colors: true }
});
//run webpack hot reload server on port 8081
webpackServer.listen(8081, 'localhost', function() {});
//run express server on port 8080
app.listen(8080);
有人可以像我昨天从火星下来一样向我解释这个概念吗?
我不明白两件事:
- 为什么我们需要代理
- 如何将 react-routes 传递给 express,以便在被询问时在每条路线上为它们提供服务。 (也许marty-express可以帮助我们完成这项任务,但我猜我们可以在没有它的情况下手动完成)
呸...帮助我摆脱这种文档稀缺地狱!请大方地回答。请记住,我昨天刚从火星来。
谢谢..!