Nuxt3项目启动报错：无法找到typescript模块，求替代方案

启动Nuxt3项目时抛出错误：
Cannot start nuxt: Failed to load plugin '@typescript-eslint' declared in '.eslintrc.cjs » @nuxtjs/eslint-config-typescript': Cannot find module 'typescript'

虽然Nuxt3默认内置TypeScript，但仍出现该报错，以下是项目配置文件：

项目配置文件 #

package.json #

{
  "name": "nuxt-app",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
    "@nuxt/devtools": "latest",
    "@nuxtjs/eslint-config-typescript": "^12.1.0",
    "@nuxtjs/eslint-module": "^4.1.0",
    "eslint": "^8.50.0",
    "eslint-config-airbnb-base": "^15.0.0",
    "eslint-plugin-nuxt": "^4.0.0",
    "eslint-plugin-vue": "^9.17.0",
    "nuxt": "^3.7.3"
  }
}

.eslintrc.cjs #

module.exports = {
    root: true,
    env: {
        browser: true,
        es2021: true,
        node: true
    },
    parser: 'vue-eslint-parser',
    parserOptions: {
        parser: "@typescript-eslint/parser",
        sourceType: "module",
    },
    plugins: [
        'vue',
        '@typescript-eslint'
    ],
    extends: [
        'plugin:nuxt/recommended',
        'airbnb-base',
        'plugin:vue/vue3-recommended',
        '@nuxtjs/eslint-config-typescript'
    ],
}

nuxt.config.ts #

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  devtools: { enabled: true },
  modules: [
    ['@nuxtjs/eslint-module', { /* module options */ }],
  ],
})

可行解决方案 #

方案1：显式安装TypeScript到项目依赖 #

ESLint相关插件（如@typescript-eslint/parser）需要在项目的node_modules中直接找到TypeScript包，执行以下命令安装：

npm install typescript --save-dev
# 或使用pnpm
pnpm add typescript -D
# 或yarn
yarn add typescript --dev

方案2：调整ESLint配置，移除TypeScript相关依赖 #

如果项目暂时不需要TypeScript语法检查，可修改.eslintrc.cjs，去掉所有TypeScript相关配置：

module.exports = {
    root: true,
    env: {
        browser: true,
        es2021: true,
        node: true
    },
    parser: 'vue-eslint-parser',
    parserOptions: {
        sourceType: "module",
    },
    plugins: [
        'vue'
    ],
    extends: [
        'plugin:nuxt/recommended',
        'airbnb-base',
        'plugin:vue/vue3-recommended'
    ],
}

方案3：通过peer依赖关联内置TypeScript #

在package.json中添加TypeScript的peer依赖声明，让包管理器自动关联Nuxt内置的TypeScript版本，但需注意版本兼容性：

"peerDependencies": {
  "typescript": "^5.0.0"
}

执行npm install后，包管理器会将Nuxt内置的TypeScript映射到项目依赖中，但这种方式可能存在版本兼容风险，需谨慎使用。

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