2

我有一个现有的应用程序,它在服务器端运行 nodejs 和 express,在客户端运行 React。打字稿贯穿始终。

客户端代码是使用 create-react-app 创建的,并已被弹出。此代码在 /client 中。

服务器端代码在 /server 中。

这些文件夹中的每一个都有自己的 node_modules、package.json、webpack 配置等。

目前,我必须在开发时在端口 3000 上运行客户端,在端口 5000 上运行服务器。相反,我正在研究如何让它工作,以便一切都从端口 5000 运行,包括客户端捆绑包的自动重新编译。我认为 webpack-dev-middleware 可以让我做到这一点。但是,我遇到了与相对路径相关的问题。

这是我添加到服务器 (/server/src/app.ts) 的代码:

import * as webpack from 'webpack';
import * as webpackDevMiddleware from 'webpack-dev-middleware';

const webpackConfig = require('../../client/config/webpack.config.dev.js');
const webpackCompiler = webpack(webpackConfig);

this.app.use(webpackDevMiddleware(webpackCompiler, {
  publicPath: webpackConfig.output.publicPath,
  stats: { colors: true }
}));

我引用的 webpack 配置文件是 create-react-app 附带的标准配置文件。因为该文件位于 /client/config 文件夹中,所以我收到有关模块解析的错误:

ERROR in ../client/config/webpack.config.dev.js
Module not found: Error: Can't resolve './env' in '/client/config'
 @ ../client/config/webpack.config.dev.js 11:29-45
 @ ./src/app.ts
 @ multi ./src/app.ts

ERROR in ../client/config/webpack.config.dev.js
Module not found: Error: Can't resolve './paths' in '/client/config'
 @ ../client/config/webpack.config.dev.js 12:14-32
 @ ./src/app.ts
 @ multi ./src/app.ts

ERROR in ../client/config/webpack.config.dev.js
Module not found: Error: Can't resolve './polyfills' in '/client/config'
 @ ../client/config/webpack.config.dev.js 37:4-34
 @ ./src/app.ts
 @ multi ./src/app.ts

在服务器端 webpack 捆绑期间发生此错误。有没有办法让它工作?

4

0 回答 0