BuilderIO / partytown

Relocate resource intensive third-party scripts off of the main thread and into a web worker. 🎉
https://partytown.builder.io
MIT License
13.01k stars 432 forks source link

[🐞] Vite - Failed to load url /~partytown/partytown.js #430

Open kouts opened 1 year ago

kouts commented 1 year ago

Describe the bug

I have included Partytown for Vite using the supplied instructions in the docs.

index.html

<script src="/~partytown/partytown.js"></script>

vite.config.js

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { join, resolve } from 'path'
import { partytownVite } from '@builder.io/partytown/utils'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    partytownVite({
      dest: join(__dirname, 'dist', '~partytown'),
    }),
  ],
  resolve: {
    alias: [
      {
        find: /^@\/(.+)/,
        replacement: resolve(__dirname, 'src') + '/$1',
      },
    ],
  },
})

Although the partytown script gets loaded, I get an error in the terminal while in dev mode: Failed to load url /~partytown/partytown.js (resolved id: /~partytown/partytown.js). Does the file exist?

Reproduction

https://stackblitz.com/edit/vue3-script-setup-with-vite-h2k23d

Steps to reproduce

Just visit the reproduction in this Stackblitz here. You should see the error in the terminal

Browser Info

Browser agnostic

Additional Information

image

mhevery commented 1 year ago

It does not look like you are serving that /~partytown/partytown.js from your setup. You need to configure your server to serve those filse.

kouts commented 1 year ago

This is the Vite dev server running, any idea how to configure it properly?

mateusfmello commented 7 months ago

Same issue, but when I open it in the browser the script is located.

I'm using the path /partytown.js

// vite.config.ts

export default defineConfig({
    plugins: [
        vue(),
        vueJsx(),
        partytownVite({
            dest: path.join(__dirname, "dist", "~partytown")
        }),
    ],
});
// index.html 

<head>
    <script>
        partytown = {
            debug: true,
        }
    </script>

    <script src="/partytown.js"></script>
</head>
fromaline commented 5 months ago

Same issue here, partytownVite doesn't seem to copy files