Question

我试图了解Express和Webpack如何一起使用以发布不同的内容......

1）客户端js捆绑

2）index.html

3）其他静态资源

...取决于被击中的Express端点。

模块化中：

我看到Express如何根据路由模块化服务器代码，Webpack可以进行代码分割，但我不能完全适应2，根据端点发送完全不同的应用程序。

就像我想象的那样：

Express中的文件结构：

/app
 -app.html
 /public
  -bundle.js 

/app2
 -app2.html
 /public
  -bundle2.js

app.js

app.use("/app1", express.static(__dirname + "/app1/public/"));

app.use("/app2", express.static(__dirname + "/app2/public2"));

app.get('/app', function(req, res){
    res.sendFile(__dirname + '/app1/app1.html');
});

app.get('/app2', function(req, res){
    res.sendFile(__dirname + '/app2/app2.html');
});

然而，我还没有看到任何有信誉的例子做这样的事情 - 这通常意味着我做错了什么。哈哈

我看到的内容：

-Webpack代码拆分示例使用相同的公共文件夹（如何发送不同的静态文件？）

- 因为我使用React - 大多数示例都是混合服务器端策略（同构）和/或使用Jade（这使得很难想象如何为纯客户端js策略创建分裂结构）

问题：

是否有一种标准化的方法来构建我用Webpack和Express描述的客户端编码分割？

Answer 1

Express制作了一个非常简短的mention子应用程序：

var express = require('express');

// app 1
var app1 = express();
app1.use("/", express.static('app1'));

// app 2
var app2 = express();
app2.use("/", express.static('app2'));

// main app
var app = express();
app.use('/app1', app1);
app.use('/app2', app2);

app.listen(3000);

Express mentions还编写了一个单独的中间件和路由系统：

var express = require('express');

// app 1
var app1 = express.Router();
app1.use("/", express.static('app1'));

// app 2
var app2 = express.Router();
app2.use("/", express.static('app2'));

// main app
var app = express();

app.use('/app1', app1);
app.use('/app2', app2);

app.listen(3000);

Express / Webpack / React：如何根据端点发送不同的客户端应用程序？

1 个答案: