Subscribe on changes!

html element attribute name with hyphen will break in build/preview, but works in dev

avatar
Jul 26th 2022

Vue version

3.2.37

Link to minimal reproduction

https://sfc.vuejs.org/#eNp9Uk1PwzAM/Ssmlw5pbSR2QKo6NODCEQkkLrl0qzcKzYcSd4Cq/necrpvKkHaL/ez3nGd34t65bN+iyEURNr52BAGpdXfK1NpZT9CBxy30sPVWQ8KlyQl6tNqN+UzGIDIxDMpsrAkEOuxgGftnyRM2jYU365vqKrlWppAHORbigFC7piTkCKDYRN68TAm/aakEsygB8oCt/fiojWsJ9qm2FTbHKoYKeSITc3GYNNWlyz6CNfzNLnarEQhK5DBkYo6nj7ES70Qu5FK2xn3uMh5HrhiTvjVUa0wrq1eL7CZb3MqqDjTNZxh0uvb2K6BnRSXmE3LJyT361KOp0KO/KHZW+0fwDPsnGjV7ZXo24LiWuOCJy8VDS2RNdJ+K0Ni4B56Sug7KV7Ydeu5nl+WIFfLUMDF42N3Z2VS4rQ0+e+vCbHB24BtdVkQ/DnN4IV+b3egNd5RtwyVJvJ1h8OmBiP4X807pnQ==

Steps to reproduce

  1. npm run build
  2. npm run preview

What is expected?

successfully show UI

What is actually happening?

a "Uncaught type error: n.toUpperCase is not a function" throwed in console, and nothing is been displayed

System Info

WSL2 on windows:

  System:
    OS: Linux 5.4 Ubuntu 20.04.3 LTS (Focal Fossa)
    CPU: (20) x64 Intel(R) Core(TM) i9-10900K CPU @ 3.70GHz
    Memory: 17.11 GB / 23.48 GB
    Container: Yes
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 16.15.1 - ~/.nvm/versions/node/v16.15.1/bin/node
    Yarn: 1.22.19 - ~/.yarn/bin/yarn
    npm: 8.11.0 - ~/.nvm/versions/node/v16.15.1/bin/npm
  npmPackages:
    vue: ^3.2.37 => 3.2.37

Any additional comments?

If html element attribute name has a hyphen, it breaks after build->preview, but works in dev

<MyComponent a-text="blah" />

workaround: use camelCase would work in build and dev:

<MyComponent aText="blah" />
avatar
Aug 2nd 2022

I had the same problem

avatar
Aug 2nd 2022

it's not problem of Vue, but 3rd party library. I couldn't remember how I fixed it, but you can start debugging from minimal Vue project then add your 3rd party libraries 1 by 1 to narrow down the library that caused problem.

avatar
Aug 2nd 2022

I have been looking for two days, still have not found which third-party framework problems, hard to

avatar
Aug 2nd 2022

Can you help me think about which framework, it seems to be related to the i18n problem, thank you very much 🙏

avatar
Aug 3rd 2022

I can't remember. It was pretty small fix. If you can provide a mini repo that produce the bug, I can take a look.