vite base full url option seems not work in development

Describe the bug

vite base full url option seems not work in development

export default defineConfig({
  base: 'http://localhost:3000/test/',
  plugins: [vue({
    template: {
      transformAssetUrls: {
        base: 'http://localhost:3000/test/',
      }
    }
  })]
})

Reproduction

https://github.com/lovetingyuan/vite-base-full-url

System Info

Output of npx envinfo --system --npmPackages vite,@vitejs/plugin-vue --binaries --browsers:

  System:
    OS: macOS 10.15.7
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Memory: 342.65 MB / 16.00 GB
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 14.15.4 - ~/.nvm/versions/node/v14.15.4/bin/node
    Yarn: 1.22.5 - /usr/local/bin/yarn
    npm: 6.14.10 - ~/.nvm/versions/node/v14.15.4/bin/npm
  Browsers:
    Chrome: 90.0.4430.85
    Edge: 90.0.818.42
    Firefox: 82.0.2
    Safari: 14.0
  npmPackages:
    @vitejs/plugin-vue: ^1.2.1 => 1.2.1 
    vite: ^2.1.5 => 2.2.1 

Used package manager: yarn

---

Before submitting the issue, please make sure you do the following

• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn’t already an issue that reports the same bug to avoid creating a duplicate.
• Provide a description in this issue that describes the bug.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it’s a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.

[joeldenning]

I also have encountered this, and investigated the cause. It seems related to the following code:

https://github.com/vitejs/vite/blob/d36e10ed99fe765a5f25268bdf8252fe0b026701/packages/vite/src/node/config.ts#L567-L572

Notice how in the above code, the base is converted to only its path name during the serve target. The path (without the host/origin part of the base) is then used in the code below when creating the vue sfc compiler’s assetUrlOptions.

https://github.com/vitejs/vite/blob/042360894a7d4d749684bb44e88ce4a06a9aa8a1/packages/plugin-vue/src/template.ts#L118-L122

I explored a possible fix by commenting out the logic in resolveBaseUrl that causes this. It got close to working, but the vite web socket connection was made to the incorrect URL. Not sure if that was the correct approach, but it seems that if the web socket logic is updated to support absolute base urls, that everything might work.

[TechAkayy]

This has been hitting me very badly past few days, hope this gets prioritised… Thank you!