title: React Static Website Problem Deploying on GCP (can't find main.js or main.css)
body: <p>I followed this tutorial: <a href="https://cloud.google.com/storage/docs/hosting-static-website" rel="nofollow noreferrer">https://cloud.google.com/storage/docs/hosting-static-website</a> to host my React webapp. Here is what I have so far:</p>
  <pre><code>// app.yaml
  runtime: nodejs10
  
  handlers:
    - url: /static
      static_dir: build/static
  
    - url: /(.*\.(json|ico|js))$
      static_files: build/\1
      upload: build/.*\.(json|ico|js)$
      
    - url: /.*
      static_files: build/index.html
      upload: build/index.html
  </code></pre>
  <p>(I've tried MANY configurations here)</p>
  <p>I run <code>npm run build</code> and put the build directory in GCP Cloud Storage along with <code>app.yaml</code>. When I go to my website I get this:</p>
  <p><a href="https://i.stack.imgur.com/yFJAk.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/yFJAk.png" alt="enter image description here" /></a></p>
  <p>This happens when I hit the root url.</p>
  <p>It looks like it is looking at the <code>static</code> directory which should then look at <code>build/static</code> according to my <code>app.yaml</code>.</p>
  <p><a href="https://i.stack.imgur.com/mw4FH.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/mw4FH.png" alt="enter image description here" /></a></p>
  <p>If I go directly to the webpage such as <code>https://www.drinkingbuddy.io/build/static/js/main.39aaab31.js</code>, the browser displays the file as expected. So it is there being hosted but something is messed up with pathing? I'm not sure.</p>
  <p>Testing locally, everything works. Even when serving the build files.</p>
  <p>Any guidance would be greatly appreciated! Thank you.</p>
  <p><strong>EDIT:</strong></p>
  <p>Another thing is that when I go to the base url, it just shows the document tree.<a href="https://i.stack.imgur.com/Z9eSl.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Z9eSl.png" alt="enter image description here" /></a></p>
  <p><strong>EDIT 2:</strong>
  When accessing the files directly from the bucket such as <a href="https://www.storage.googleapis.com/drinkingbuddy-static/build/index.html" rel="nofollow noreferrer">https://www.storage.googleapis.com/drinkingbuddy-static/build/index.html</a>, I then get this error:</p>
  <pre><code>This XML file does not appear to have any style information associated with it. The document tree is shown below.
  &lt;Error&gt;
  &lt;Code&gt;UserProjectAccountProblem&lt;/Code&gt;
  &lt;Message&gt;User project billing account not in good standing.&lt;/Message&gt;
  &lt;Details&gt;The billing account for the owning project is disabled in state absent&lt;/Details&gt;
  &lt;/Error&gt;
  </code></pre>
  <p>But looking through my account I don't see any billing issues.</p>
  <p><strong>EDIT 3:</strong></p>
  <p>Now I am able to get to <code>.../build/index.html</code> and it displays my site. but the root <code>/</code> is still throwing errors saying it can't find main.js. I added <code>homepage: &quot;.&quot;</code> to my package.json.</p>