我可以在不运行“npm run build”的情况下从快速服务器提供 create react 应用程序吗？

Question

I have a nodejs with express server. I would like to server a create react app from the server. Is this possible with out building the react app?

Example from a project im working on right now.

I server a built react app like this...

 //// Server static resources.
ROUTER.use('/static', EXPRESS.static(PATH.join(__dirname, '../', '../', 'project', 'build', 'static')));
//// Server built react app. 
ROUTER.get('/',  function(req, res) {        
    res.sendFile(  PATH.join(__dirname, '../', '../', 'project', 'build', 'index.html' ));
});

Any way I can server the react app without building it? Something like...

ROUTER.get('/', function(req, res) {
    //redirect to loopback port for react app. 
});

Answer 1

You need to define a project layout which suits you well.

Since you have client side and server side code, you could maintain two folders, each one containing module-specific code.

CLI tools like create-react-app expects such approach to be adopted, unless your project uses some kind of SSR

A reasonable good project layout looks like this:

my-project/
├── my-project-react/
│   ├── package.json 
│   ├── src/  
│   ├── (... other project files) 
│   └── README.md 
├── my-project-express/
│   ├── package.json 
│   ├── app/ 
│   ├── (... other project files) 
│   └── README.md 
├── .gitignore 
└── README.md

That way you can serve express with nodemon and react with webpack dev server, just remember to enable cors on express . You also must adjust the service address inside your web app project, depending on NODE_ENV.

Answer 2

crisp-react has a backend subproject based on Express that serves a sample React application (which is not CRA).

If you follow Getting started or alternatively execute commands:

• git clone https://github.com/winwiz1/crisp-react.git
• cd crisp-react
• yarn install && yarn start:prod
  Express is running...
  Terminate by Control+C

then you will have a running instance of Express serving a react app which you can see by pointing a browser to localhost:3000. The backend/Express subproject only serves the React app, it doesn't build the app and in fact cannot build it because the backend doesn't have React library in its package.json as a dependency.