title: Cloudfront serving javascript files as Mime type of Text/plain
body: <p>A Vue app being statically hosted on S3 is serving JS files properly through HTTP, but when the site is accessed through the linked CloudFront URL the app does not load because javascript is received from the server as text type. Are there any setting I can change to remedy this? Thank you so much if you can help.
  index.html source in dist folder:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;link rel="stylesheet" href="/font/inter.css" /&gt;
    &lt;script type="module" crossorigin src="/assets/index.74e9a26f.js"&gt;&lt;/script&gt;
    &lt;link rel="modulepreload" href="/assets/vendor.cb99a641.js"&gt;
    &lt;link rel="stylesheet" href="/assets/index.7303d77a.css"&gt;
  &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="app"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p><a href="https://i.stack.imgur.com/Bfqjk.png" rel="nofollow noreferrer">HTTP site directly to S3</a></p>
  <p><a href="https://i.stack.imgur.com/m1ZZh.png" rel="nofollow noreferrer">Same settings but on cloudfront HTTPS link</a></p>