You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

Netlify部署React应用后遇304状态及语法错误求助

Troubleshooting Your React App Deployment on Netlify

Let's walk through what's causing these issues and fix them one by one:

First, Why the "Unexpected Token <" Error?

This error almost always means your browser is trying to load a JavaScript/CSS file, but instead gets an HTML file (usually your index.html) because the resource path is wrong. When Netlify serves index.html for a missing resource (thanks to your _redirects rule), the browser tries to parse HTML as JS, which throws that syntax error.

Common Causes & Fixes

  1. You Uploaded the build Folder Instead of Its Contents
    This is the most frequent mistake with manual Netlify uploads. If you dragged the entire build folder into Netlify's uploader, your app's files are actually sitting under a /build/ subpath on Netlify, but your React build expects them to be at the root.

    • Fix: Open your local build folder, select all the files and folders inside it (like index.html, static/, and your _redirects file), then upload those directly to Netlify. Don't upload the build folder itself.
  2. Incorrect _redirects File Placement
    Your _redirects file needs to live in the same directory as index.html (the root of your deployed files). If you placed it outside the build folder, or inside a subfolder, Netlify won't pick it up correctly.

    • Fix: Move _redirects to your local build folder (next to index.html), re-upload the contents of build, and it should work as intended.
  3. Cached Resources Causing 304 Issues
    The 304 status means your browser is using cached versions of old, broken resources. Even after fixing the upload, cached HTML/JS might still cause errors.

    • Fix: Force a hard refresh of your browser (Ctrl+Shift+R on Windows/Linux, Cmd+Shift+R on Mac) to clear the cache and load the latest files from Netlify.

Bonus: Use Netlify's Automated Deployment (More Reliable)

Manual uploads are prone to path errors. For a smoother workflow, connect your GitHub repository directly to Netlify:

  • Netlify will automatically run npm run build every time you push code to your repo.
  • It'll deploy the correct build folder contents to the root path by default, eliminating manual upload mistakes.

Verify the Fix

After making these changes, check your browser's DevTools (Network tab):

  • All static/js/ and static/css/ files should return a 200 status code.
  • You shouldn't see any HTML files being served in place of JS/CSS resources.

内容的提问来源于stack exchange,提问作者user11138609

火山引擎 最新活动