你有没有遇到过 TinyVue 一闪一闪地跑到你项目里然后才发现它偷偷把你的样式搞乱，或者让你手一抬就崩掉？我跟你说这可不是魔法，而是坑。今天咱们一起把这些坑点列出来别再被它们敲得晕头转向了。

1️⃣ CSS 变量前缀冲突

TinyVue 从 v3 开始，把 CSS 变量前缀改成了 --tv-，以前是 --ti-. 你Ru果还在用旧版的样式表，就会和别的组件库冲突。比如 Element Plus 用的也是 --el-, 两个库Ru果名字重叠，谁先写谁就会被覆盖。

解决思路：自定义前缀替换

const cssPrefixPlugin = {
  name: 'css-prefix-plugin',
  enforce: 'post',
  transform {
    return code.replace
                .replace
  }
}
export default defineConfig({
  plugins:
})

这样所有 TinyVue 的变量dou会变成 --myapp-*, 就不会跟别家撞车了。

2️⃣ 全局 API 名冲突

TinyVue 的弹窗、消息等全局服务dou挂在 Vue 实例上，例如 $modal.alert. Ru果你项目里还有 Element Plus 或者其他库，它们也可Neng有同名的方法，那就搞混了。

办法：改前缀或统一命名空间

import { globalConfig } from '@opentiny/vue'
globalConfig.$TinyModalApiPrefix = 'Tiny'

然后调用时改成 $TinyModal.alert. Ru果还是有冲突，Ke以把所有全局服务dou放进一个对象里然后按需引入。

3️⃣ 空的 .vue 文件报错

TinyVue 在编译时会遍历所有 .vue 文件，Ru果遇到完全空白的文件，就会抛出错误：“模板缺失”。这常见于刚拷贝代码后忘记删掉占位文件。

检查方法：快速找空文件

find src -name "*.vue" -empty
# 或者geng精确：
grep -rL "