Sublime编写Vue代码_Sublime安装Vue语法高亮插件详细步骤-sublime-PHP中文网

sublime text需装vue syntax highlight插件并手动绑定.vue后缀，再启用嵌套语法开关才能正确高亮template/script/style区块。

sublime编写vue代码_sublime安装vue语法高亮插件详细步骤

Sublime Text 默认完全不识别 .vue 文件，打开就是纯文本——这不是你漏了哪步，是它压根没内置支持。唯一当前持续维护、兼容 ST4、能正确高亮 <template></template> / <script setup></script> / <style scoped lang="scss"></style> 的插件，只有 Vue Syntax Highlight。

怎么装 `Vue Syntax Highlight`？别装错名字

旧插件如 vue-component（ST2 专用）或少个 s 的 Vue Syntax Highlight（停更多年）都会报错：ImportError: No module named 'sublime_plugin'。必须严格按以下操作：

确保已装 Package Control（没装就先按 Ctrl+` 粘贴官方安装脚本）
按 Ctrl+Shift+P（Win/Linux）或 Cmd+Shift+P（macOS）→ 输入 Package Control: Install Package → 回车
等列表加载完，输入 Vue Syntax Highlight（注意：首字母大写、中间空格、带 s 和大写 H）→ 回车安装
装完不用重启，但若右下角仍显示 Plain Text，说明还没绑定后缀——这是下一步要解决的

为什么装了还是白底黑字？必须手动绑定 `.vue` 后缀

插件只提供语法定义，不会自动把 .vue 文件和它关联起来。哪怕你重装十遍，不走这步，所有 .vue 文件仍是纯文本。

打开任意一个 .vue 文件
点击右下角当前语法标识（比如显示 Plain Text）
选择 Open all with current extension as… → 找到并点击 Vue Component
这个设置存在用户配置目录里，换电脑或重装 Sublime 就得重来一次

`<script></script>` 里没 JS 高亮？要开嵌套语法开关

即使绑定了 .vue 后缀，也常出现 <script></script> 里全是灰色、<template></template> 不识别 HTML 标签的问题——因为默认不启用区块内嵌套语法。

Ainative Vue Sdk

使用 `@ainative/vue-sdk` 为 Vue 3 应用添加 AI 聊天功能。适用于以下场景：(1) 安装 `@ainative/vue-sdk`，(2) 在 Vue 组件中使用 `useChat` 组合式函数，(3) 提供……

下载

进 Preferences → Package Settings → Vue Syntax Highlight → Settings
在 User 配置中加入：

{
  "enable_vue_blocks": true,
  "enable_html_in_template": true,
  "enable_js_in_script": true,
  "enable_css_in_style": true
}

若用 TypeScript，把 enable_js_in_script 改成 enable_ts_in_script，并确保已装 TypeScript 或 JavaScriptNext - ES6 Syntax 插件。

格式化、补全、跳转这些功能，`Vue Syntax Highlight` 做不了

它只负责“看得清”，不负责“排得齐”“提示对”“点得进”。想真正开发 Vue 3 项目，还得额外配：

格式化：装 JsPrettier + 全局 prettier，并在它的 User 设置里加 "custom_file_extensions": ["vue"]
补全 defineProps/defineEmits：必须上 SublimeLSP + Volar（不是 Vetur），否则光标悬停看不到类型、Ctrl+Click 跳不到声明
Emmet 缩写：可装，但需在 Emmet 设置里加 "vue" 到 scope 列表，否则 template 里不生效