Nuxt
通过 PyCharm,您可以使用 Nuxt 框架开发您的 Vue.js 应用。 在 PyCharm 中设置 Nuxt 应用的推荐方式是 使用带有专用 Nuxt 模板的新建项目向导。
开始之前
请确保您的计算机上安装了 Node.js 20 或更高版本。
确保在项目中配置了本地 Node.js 运行时:打开 设置 对话框(Ctrl+Alt+S ),然后转到 。 Node 运行时 字段显示默认的项目 Node.js 运行时。 在 配置本地 Node.js 解释器 中了解详细信息。
请确保在 设置 | 插件 页面上的 已安装 选项卡中启用了必需的 JavaScript and TypeScript、 JavaScript Debugger 和 Vue.js 插件。 如需了解详情,请参阅 管理插件。
从 Nuxt 专用模板创建项目
在 欢迎 屏幕上点击 新建项目 ,或从主菜单中选择 。 将打开 新建 项目 对话框。
在左侧窗格中,选择 Nuxt。
在右侧窗格中:
指定用于存储项目相关文件的文件夹路径。
在 Node 运行时 字段中,指定要使用的 Node.js 运行时。 从列表中选择已配置的运行时,或选择 添加 以配置新的运行时。
在 Nuxt CLI 列表中,选择 npx nuxi@latest 并点击 创建。
从命令行创建项目
打开嵌入的 终端 (Alt+F12 ),然后键入:
npm create nuxt@latest <project-name>或
yarn create nuxt@latest <project-name>或
pnpm create nuxt@latest <project-name>向导会询问您一些问题。 在您回答完这些问题后,将在当前文件夹中初始化一个 Nuxt 项目,并可在 PyCharm 中使用。

请参阅 Nuxt 官方网站 了解更多信息。
针对 Nuxt 的代码辅助
PyCharm 为所有 Nuxt 核心组件 提供代码补全并显示 快速文档。

PyCharm 还会建议为 Nuxt 组件导入缺失的 import 语句(Alt+Enter。

编辑 nuxt.config.ts
PyCharm 为 nuxt.config.ts 配置文件提供适当的补全建议。

将鼠标悬停时,您还会看到文档弹出窗口,其中显示文件中使用的 Nuxt 选项的类型信息。

类型检查
Nuxt 4 开箱即用地提供完整的类型。 对于较早的 Nuxt 版本,您需要安装 @nuxt /types 包以获得更好的代码补全。
请参阅 Nuxt 官方网站 了解更多信息。
安装 @nuxt/types 包
如果您使用的是 2.9.0 及更高版本的 Nuxt,且未安装
@nuxt/types包,PyCharm 将通知您并建议将其作为开发依赖进行安装。 点击通知弹出窗口中的 将 @nuxt/types 安装为开发依赖 链接。
如果您关闭了该弹出窗口,仍可在 事件日志 工具窗口( )中点击 将 @nuxt/types 安装为开发依赖 链接来安装
@nuxt/types。或者,打开嵌入的 终端 (Alt+F12 ),然后键入:
npm install --save-dev @nuxt/types