Roots Sage10+Bud Vue集成故障：Vue运行时编译不支持

问题场景 #

更新Acorn至3.1版本后，执行yarn dev构建资源，Vue组件无法加载，控制台抛出警告：

Component provided template option but runtime compilation is not supported in this build of Vue. Configure your bundler to alias "vue" to "vue/dist/vue.esm-bundler.js".

当前环境依赖：

"devDependencies": {
    "@roots/bud": "6.11.0",
    "@roots/bud-babel": "^6.11.0",
    "@roots/bud-tailwindcss": "6.11.0",
    "@roots/bud-vue": "^6.11.0",
    "@roots/sage": "6.11.0"
  },

已尝试设置app.vue.set('runtimeOnly', true)和Vue别名，但配置未生效。

可行解决方案 #

1. 修正runtimeOnly配置 #

runtimeOnly: true是bud-vue默认的仅运行时模式，要启用模板编译，需将其设为false，修改bud.config.js：

export default async (app) => {
  app.vue.set('runtimeOnly', false);
};

2. 配合正确的别名配置（可选） #

如果上述设置仍不生效，可显式指定Vue的完整构建包别名，注意使用bud的标准别名写法：

export default async (app) => {
  app
    .vue.set('runtimeOnly', false)
    .alias({
      'vue': app.path('@node_modules/vue/dist/vue.esm-bundler.js'),
    });
};

3. 清理缓存后重新构建 #

配置修改后必须清理旧构建缓存，避免残留影响：

yarn bud clean && yarn dev

额外排查方向 #

• 检查Vue组件是否存在内联模板字符串（如template: '<div>...</div>'），这种写法必须依赖运行时编译；若使用单文件组件（.vue），模板会被预编译，通常无需启用运行时编译。
• 临时回退Acorn版本，验证是否为版本兼容性冲突导致的问题。

内容的提问来源于stack exchange，提问作者stevenprinsloo