Skip to content

Chunk names with %20 after build (3.3.0-beta.5) #8270

@jm-sky

Description

@jm-sky

Vue version

3.3.0-beta.5

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-bttikt?file=src/components/GenericComponent.vue

Steps to reproduce

When using generic component (vuejs/rfcs#436, vuejs/language-tools#2545), I got invalid chunk names (with %20) after npm run build in /dist/assets folder.

Example chunk name created from component using:

<script setup lang="ts" generic="TModel extends BaseModelWithBankAccounts">

Example:

  • BankAccountsList.vue_vue_type_script_setup_true_generic_TModel%20extends%20BaseModelWithBankAccounts_lang-147e6095.js

After replacing %20 with (space) in file names - everything works fine.

I've tried to reproduce the error but haven't succeeded yet.

It might occure when using generic component in many routes, so it would be placed in its own chunk.

What is expected?

Chunks should not have %20 in their names, but rather space or dash -.

What is actually happening?

I got chunks with %20 in their names.
Browser is probably looking for a file with spaces, but there is a file with %20, and I got 404 not found error.

Example:

  • dist/assets/BankAccountsList.vue_vue_type_script_setup_true_generic_TModel%20extends%20BaseModelWithBankAccounts_lang-147e6095.js
  • dist/assets/GenericComponent.vue_vue_type_style_index_0_lang-3f2af169.js (simpler variant)

System Info

System:
    OS: Windows 10 10.0.19044
    CPU: (12) x64 Intel(R) Core(TM) i5-10500 CPU @ 3.10GHz   
    Memory: 42.53 GB / 63.75 GB

  Binaries:
    Node: 18.12.1 - C:\Program Files\nodejs\node.EXE
    npm: 9.1.3 - C:\Program Files\nodejs\npm.CMD

  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (113.0.1774.35)
    Internet Explorer: 11.0.19041.1566

  npmPackages:
    vue: 3.3.0-beta.5 => 3.3.0-beta.5 
    vue-router: 4.1.6
    vue-tsc: 1.6.4
    vite: 4.3.5
    typescript: 5.0.4
    postcss: 8.4.23
    @vue/tsconfig: 0.3.2

Any additional comments?

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions