放弃 Vue3 传统 <script>！我的 VuReact 编译器做了一次清醒取舍

前言

在我维护的 VuReact 编译器新版本里，我做了一个很明确的架构调整：直接停止对 Vue 传统 <script> 语法的支持，之后只专注 <script setup> 现代写法。

这不是一时冲动，而是踩过坑、算过成本、看清方向后，做出的最理性选择。这篇文章把整个思考过程一次性说清楚。

一、最初想兼容，结果踩进死胡同

最开始我也想尽量多支持几种写法，传统 <script> 也一并兼容。 当时的思路很简单：只提取里面 setup() 函数的代码。

<script>
export default {
  setup() {
    // 只有这一段能正常处理
    const count = ref(0);
    return { count };
  },
  data() {
    return { message: 'Hello' }; // 完全处理不了
  },
  methods: {
    showMessage() {
      console.log(this.message); // 也处理不了
    }
  }
};
</script>

跑起来才发现问题根本绕不开：

• 只能处理 setup()，data/methods/computed/watch/生命周期全部无效
• 编译能通过，但运行直接出问题
• 给使用者造成“支持”的错觉，实际是残缺功能

这种“能用但不完全能用”的支持，比直接不支持更坑人。

二、完整支持传统语法？复杂度完全扛不住

我也认真评估过：要不要把传统语法完整实现？

结论是：成本高到不可行。 要完整支持，就必须处理一整套 Vue 组件选项：

• data() 响应式数据
• computed 计算属性
• methods 方法
• watch
• 生命周期钩子
• props / emits 声明
• provide / inject
• mixins 混入

这意味着：

• 要写两套完全不同的解析逻辑
• 要处理大量边缘情况
• 规则复杂、极易出 bug

维护两套语法的后果：

• 测试用例翻倍
• 文档要写两份
• 每次更新都要兼顾两套逻辑，精力被严重分散
• 核心功能没时间优化

简单说：为了兼容老写法，会拖垮整个工具的质量与迭代速度。

三、想清楚：这个工具到底为谁而做

观察 Vue 生态就能明显感受到：

• Vue 官方早已把 <script setup> 定为推荐写法
• 新项目几乎都用 Composition API
• 现代工具链、教程、社区最佳实践都在向新语法靠拢

我的目标很清晰： 为使用 Vue 3 现代语法的开发者，提供更稳定、更好用的工具。 不追求大而全，只追求小而精、稳而强。

四、三个方案摆在面前，我选了最专注的一个

方案1：继续半残支持

• 表面上支持更多写法
• 实际体验极差，问题不断
• 长期维护越来越痛苦

方案2：完整实现传统语法

• 能覆盖更多使用者
• 开发与维护成本极高
• 会大幅拖慢核心功能迭代

方案3：砍掉传统语法，只专注 <script setup>

• 集中精力把一件事做到最好
• 架构更简单，长期更容易维护
• 对主流现代语法用户完全无影响

我最终选择了 方案3。 作为独立开发者，资源有限，必须聚焦，才能把东西做稳、做好。

我直接把缺失的「版本策略」完整内容写给你，并且告诉你加在文章哪个位置，一字不改贴合你现在的全文风格、主语、语气。

五、版本策略：平稳过渡，不影响主流用户

我将这次停止支持传统语法的变更，放在 VuReact 编译器 1.5.2 版本 中发布。

这样做的原因很明确：

• 这是对原有残缺实现的修复，而非破坏性升级
• 对一直在用 <script setup> 的主流用户完全无影响
• 严格遵循语义化版本规范，属于向下兼容的问题修正

同时，我也为传统语法使用者提供了清晰明确的错误提示，避免困惑。

if (检测到传统语法) {
  throw new Error(
    `Traditional Vue <script> syntax is not supported. Please migrate to <script setup>.n` +
    `at <anonymous> (${filename})`
  );
}

六、砍掉之后，边界反而更清晰

之前的糟糕体验

• 编译不报错，运行时异常
• 使用者不知道哪些功能可用
• 排查问题成本很高

现在的清晰体验

• 遇到传统语法，编译阶段直接明确报错
• 提示信息直白：请迁移到 <script setup>
• 能力边界一目了然，不模糊、不误导

七、这次决策，我总结了4条技术原则

1. 深度 > 广度：宁在一个方向做到极致，不做一堆半吊子功能
2. 诚实告知能力边界：支持就支持，不支持就明确说，不制造虚假预期
3. 质量优先：不推出残缺功能，对使用者负责
4. 保持架构简单：简单才能长期维护、持续迭代

八、写给开发者的一点心得

• 做工具/做框架，别贪多求全，边界越清晰越稳定
• 独立开发者更要学会取舍，专注才能打出优势
• 发现设计走偏，及时止损比硬扛更重要
• 技术决策没有绝对完美，只有更适合长期发展

结语

停止支持 Vue 传统 <script>，不是刻意排斥老项目，而是在有限时间与精力下，做出的最负责任的选择。放弃“大而全”，选择“小而美”；放弃模糊兼容，选择明确专注。

未来我会把所有精力放在 <script setup> 现代语法上，提供更稳定、更高效、更贴合 Vue 生态的工具。

如果你正在使用现代语法，这次更新对你完全无影响；

如果你还在使用传统写法，也建议逐步迁移到 <script setup>，这也是官方与社区的共同方向。

技术取舍，从来都是：有所不为，才能有所为。

相关资源

• GitHub：github.com/vureact-js/…

• Gitee：gitee.com/vureact-js/…

• 官方文档：vureact.top

持续更新 Vue → React 迁移实战、原理与避坑干货！