<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Tom</title>
    <description>The latest articles on DEV Community by Tom (@tomelsj).</description>
    <link>https://dev.to/tomelsj</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1191947%2F42b8b96e-7294-4dee-8131-6af5c5e9fcc3.png</url>
      <title>DEV Community: Tom</title>
      <link>https://dev.to/tomelsj</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/tomelsj"/>
    <language>en</language>
    <item>
      <title>[SOLVED]Yet another docker + vite, The connection was reset</title>
      <dc:creator>Tom</dc:creator>
      <pubDate>Mon, 23 Oct 2023 10:23:23 +0000</pubDate>
      <link>https://dev.to/tomelsj/yet-another-docker-vite-the-connection-was-reset-35na</link>
      <guid>https://dev.to/tomelsj/yet-another-docker-vite-the-connection-was-reset-35na</guid>
      <description>&lt;p&gt;Alright, I am at my wit's end here. I am trying to run vite inside a docker container, that's it. Together with the Laravel plugin 'laravel-vite-plugin'. In a php:8.1-apache container. But it won't load. The console screams&lt;br&gt;
&lt;code&gt;Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:5173/@vite/client. (Reason: CORS request did not succeed). Status code: (null).&lt;/code&gt;&lt;br&gt;
When I try to visit &lt;a href="http://localhost:5173/@vite/client"&gt;http://localhost:5173/@vite/client&lt;/a&gt;, the browser tells me, "The connection was reset.". Not sure how else debug this through.&lt;/p&gt;

&lt;p&gt;I run a standard php:8.1-apache Dockerfile with docker-compose build and docker-compose up. All I added are some lines in the Dockerfile to install node. Then I expose the ports 80:80 and 5173:5137 in docker-compose.yml. I configure vite like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/js/app.js'],
            refresh: true
        }),
        vue({
            template: {
                transformAssetUrls: {
                    base: null,
                    includeAbsolute: false
                }
            }
        })
    ],
    server: {
        host: '0.0.0.0',
        port: 5173,
        hmr: {
            port: 5173,
            clientPort: 5173,
            host: 'localhost'
        }
    }
});
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;And then I simply run npx vite inside the php:8.1-apache container. I tried everything I could think of but I cannot get this to work! Is it possible that apache blocks this somehow?&lt;/p&gt;

</description>
      <category>vite</category>
      <category>laravel</category>
      <category>docker</category>
      <category>cors</category>
    </item>
  </channel>
</rss>
