<p>I used <code>vite</code> to create a react app with typescript and I follow a tutorial to get a good starter (<a href="https://www.youtube.com/watch?v=cchqeWY0Nak" rel="nofollow noreferrer">video</a>). I have another application in angular and it works fine with this <code>approach</code> I'm deploying it to <code>kubernetes</code> using <code>ngix</code>, but with <code>vite</code> i'm facing this error and I don't know the cause:</p>
<blockquote>
<p>plint2dev.linguaserve.net/:16 Refused to apply style from 'https://plint2dev.linguaserve.net/assets/index.2518dafb.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
index.f2ba2231.js:1</p>
</blockquote>
<blockquote>
<p>Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of &quot;text/html&quot;. Strict MIME type checking is enforced for module scripts per HTML spec.</p>
</blockquote>
<p>My nginx config and the repository code can be revised <a href="https://github.com/Aw3same/error-deploy-vite-ts-react" rel="nofollow noreferrer">here</a>. I tried all the alternatives provided <a href="https://stackoverflow.com/questions/29573489/nginx-failing-to-load-css-and-js-files-mime-type-error">here</a>, but no one works for me.</p>
<p>My actual <code>nginx.conf</code>:</p>
<pre><code>pid /run/nginx.pid;
worker_processes auto;
worker_rlimit_nofile 65535;

events {
        multi_accept on;
        worker_connections 65535;
}

http {
        client_max_body_size 100M;
        charset utf-8;
        sendfile on;
        tcp_nopush on;
        tcp_nodelay on;
        server_tokens off;

        # MIME
        include mime.types;
        default_type application/octet-stream;

        # logging
        access_log /var/log/nginx/access.log;
        error_log /var/log/nginx/error.log warn;

        # load configs
        include /etc/nginx/conf.d/*.conf;

        # linguaserve.net
        server {
                  listen 80;
                  listen [::]:80;
                  server_name .linguaserve.net;

                  set $base /usr/share/nginx/html;

                  # security headers
                  add_header X-Frame-Options &quot;SAMEORIGIN&quot; always;
                  add_header X-XSS-Protection &quot;1; mode=block&quot; always;
                  add_header X-Content-Type-Options &quot;nosniff&quot; always;
                  add_header Referrer-Policy &quot;no-referrer-when-downgrade&quot; always;
                  add_header X-Request-ID  $request_id;

                  location / {
                    try_files $uri $uri/ /index.html;
                  }

                  # . files
                  location ~ /\.(?!well-known) {
                    deny all;
                  }

                  # logging
                  access_log /var/log/nginx/access.log;
                  error_log /var/log/nginx/error.log warn;

                  # favicon.ico
                  location = /favicon.ico {
                    log_not_found off;
                    access_log off;
                  }


                  # gzip
                  gzip on;
                  gzip_vary on;
                  gzip_proxied any;
                  gzip_comp_level 6;
                  gzip_types text/plain text/css text/xml application/json application/javascript application/rss+xml application/atom+xml image/svg+xml;
        }
}

</code></pre>
<p><a href="https://i.stack.imgur.com/4YZAQ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/4YZAQ.png" alt="Console.log" /></a></p>
<p>From here, I'm totally lost. Any help would be appreciated.
My dockerfile</p>
<pre><code>FROM nginx

## Remove default Nginx website
RUN rm -rf /usr/share/nginx/html/*

## Copy our default nginx config
COPY nginx/default.conf /etc/nginx/nginx.conf

COPY /dist/* /usr/share/nginx/html/

RUN  cd /usr/share/nginx
RUN  ln -s /usr/share/nginx/html /usr/share/nginx/www
RUN  ln -s /usr/share/nginx/html /etc/nginx/html
EXPOSE 80

CMD [&quot;nginx&quot;, &quot;-g&quot;, &quot;daemon off;&quot;]
</code></pre>

Aw3same
<p>Finally, i solved it. It was a silly mistake. In my dockerfile, I copied all the files from <code>dist</code>, but no the directory structure.</p>
<p>Before:</p>
<pre><code>dist
│   index.12321.js
│   index.12321.css
│   index.html
│   vite.svg.     
</code></pre>
<p>Now:</p>
<pre><code>dist  
└───assests
│   │   index.12321.js
│   │   index.12321.css
│   index.html
│   vite.svg.   
</code></pre>
<p>The solution was change this command</p>
<p><code>COPY /dist/* /usr/share/nginx/html/</code></p>
<p>to this
<code>COPY /dist/ /usr/share/nginx/html/</code></p>
<p>Removing the <code>*</code> solved the pain.</p>
