Mac最新版Visual Studio运行.tsx文件提示‘Code language not supported or defined’

问题详情 #

• 系统环境：Mac，最新版Visual Studio Code
• 问题现象：完全按照教程步骤操作，但仅我遇到启动异常；切换Code Runner的运行语言为Javascript.TSX后，localhost:3000无任何输出变化
• 当前临时解决方法：切换终端到Node环境并执行npm run dev后项目可正常运行，但每次启动都必须手动执行该命令

可能的解决方案 #

1. 配置VS Code默认启动任务 #

打开VS Code命令面板（Cmd+Shift+P），输入Tasks: Configure Default Build Task，选择项目对应的npm: dev任务，自动生成.vscode/tasks.json配置，确保内容类似：

{
  "version": "2.0.0",
  "tasks": [
    {
      "type": "npm",
      "script": "dev",
      "group": {
        "kind": "build",
        "isDefault": true
      },
      "problemMatcher": [],
      "label": "npm: dev"
    }
  ]
}

之后可通过Cmd+Shift+B直接启动项目，无需手动输入命令。

2. 调整Code Runner配置（避免冲突） #

Code Runner默认是执行单个文件，不适合React这类需要完整项目启动的场景：

• 打开VS Code设置（Cmd+,），搜索Code-runner: Enable，取消勾选关闭自动运行
• 若仍需使用Code Runner，修改Code-runner: Executor Map中TSX/JSX的执行命令为项目启动脚本，比如：

  "javascriptreact": "npm run dev",
  "typescriptreact": "npm run dev"
  

3. 检查package.json脚本配置 #

确认项目根目录的package.json中scripts字段存在正确的dev命令，示例：

{
  "scripts": {
    "dev": "vite" // 或"react-scripts start"（Create React App场景）
  }
}

若命令缺失或错误，手动修正后保存。

4. 确认终端默认环境 #

打开VS Code设置，搜索Terminal > Integrated > Default Profile: Mac，选择zsh或bash作为默认终端；打开终端执行node -v和npm -v，确保Node.js环境已正确安装并加载。

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