如何在cPanel部署React应用？附项目结构及相关疑问

Absolutely, you can deploy your React app to cPanel—let’s break this down clearly for you, based on your project structure.

Is it feasible? #

100% yes. cPanel supports both static React app deployments (the most common use case) and Node.js-backed apps (if you need to run your server/server.js backend). The approach just depends on whether you’re serving a pure frontend or need to run your Node server alongside it.

Do you need to upload the node_modules/ folder? #

No, you should never upload node_modules/—here’s why:

• It’s massive (hundreds of MBs) and will slow down your upload drastically.
• Dependency versions can conflict between your local environment and the cPanel server.
• If you’re deploying a static build, you don’t need it at all (all dependencies are bundled into dist/bundle.js and styles.css).
• If you’re running a Node server, cPanel’s Node.js tools will automatically run npm install to install dependencies from your package.json—so just upload that file instead.

Step-by-Step Deployment Guide #

Option 1: Deploy as a Static React App (Recommended for Most Cases) #

This works if you don’t need to run your server/server.js backend (or if your backend is hosted separately).

• First, build your production bundle locally:
  Run npm run build (make sure your package.json has a build script pointing to your webpack config—looking at your repo, this should generate optimized files in public/dist).
• Verify the build works: Open public/index.html locally in your browser to make sure all assets load correctly.
• Upload the contents of your public/ folder (including dist/, index.html, and images/) to your cPanel’s public_html directory (or a subdirectory if you’re using a subdomain).

Option 2: Deploy with Your Node.js Server #

If you need to run server/server.js on cPanel:

• First, confirm your cPanel host offers Node.js support (most modern hosts do, via a tool like "Node.js Selector").
• Upload these files to your cPanel account (skip node_modules/):
  • server/
  • src/
  • .babelrc
  • package.json
  • webpack.config.js
• In cPanel’s Node.js Selector, create a new app:
  • Set the application root to the folder where you uploaded your files.
  • Set the startup file to server/server.js.
  • cPanel will automatically run npm install to install dependencies and start your server.
• Make sure your server is configured to serve the static React files from public/ (your server.js should already handle this if it’s set up locally).

Quick Tips #

• Double-check your webpack publicPath setting to ensure static assets load correctly on cPanel (it should be relative, like ./dist/ if your files are in the same directory as index.html).
• If you use environment variables (like API keys), set them in cPanel’s "Environment Variables" section or via your .htaccess file.
• Always test your production build locally before uploading to avoid surprises.

内容的提问来源于stack exchange，提问作者Theo I.