2

I have an existing app that runs nodejs and express on the server side and React on the client side. Typescript is used throughout.

The client side code was created with create-react-app and has since been ejected. This code is in /client.

The server side code is in /server.

Each of those folders have their own node_modules, package.json, webpack config, etc.

Currently, I have to run the client side on port 3000 when developing and the server on port 5000. Instead I'm investigating how to get it working so that everything runs from port 5000 including automatic recompilation for the client side bundle. I think webpack-dev-middleware would allow me to accomplish this. However, I'm having trouble related to relative paths.

Here is the code I've added to my server (/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 }
}));

The webpack config file that I reference is the standard one that comes with create-react-app. Because that file is in the /client/config folder, I'm getting errors about module resolution:

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

This error is happening during the server-side webpack bundling. Is there a way to get this to work?

Jed Veatch
  • 2,326
  • 3
  • 12
  • 13
  • I am supposed polyfills, paths, env is not the path file. Can you try to use 'polyfills', 'paths', 'env' instead? – Tan Duong May 11 '19 at 02:49

0 Answers0