Модуль «vue» не имеет экспортированного «вычисленного» элемента

<script setup lang = "ts">
import { IonItem, IonCheckbox, IonItemSliding, IonItemOptions, IonItemOption, IonIcon } from "@ionic/vue";
import { ref, computed } from "vue";
import dayjs from "dayjs";
import { Haptics, ImpactStyle } from '@capacitor/haptics';
import { calendarOutline, flameOutline, closeCircleOutline } from 'ionicons/icons';

Версия Vue "vue": "^3.4.35". Источник: файл package.json.

файл цконфигурации:

{
  "compilerOptions": {
    "target": "ESNext",
    "useDefineForClassFields": true,
    "module": "ESNext",
    "moduleResolution": "Node",
    "strict": true,
    "jsx": "preserve",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "esModuleInterop": true,
    "lib": ["ESNext", "DOM"],
    "skipLibCheck": true,
    "noEmit": true,
    "paths": {
      "@/*": ["./src/*"]
    }
  },
  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

Файл package.json:

{
  "name": "habit-rabit",
  "private": true,
  "version": "0.0.1",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vue-tsc && vite build",
    "preview": "vite preview",
    "test:e2e": "cypress run",
    "test:unit": "vitest",
    "lint": "eslint ."
  },
  "dependencies": {
    "@capacitor/android": "6.1.1",
    "@capacitor/app": "^6.0.0",
    "@capacitor/camera": "^6.0.0",
    "@capacitor/core": "^6.0.0",
    "@capacitor/filesystem": "^6.0.0",
    "@capacitor/haptics": "^6.0.0",
    "@capacitor/ios": "6.1.1",
    "@capacitor/keyboard": "^6.0.0",
    "@capacitor/preferences": "^6.0.0",
    "@capacitor/share": "^6.0.0",
    "@capacitor/status-bar": "^6.0.0",
    "@ionic/pwa-elements": "^3.2.2",
    "@ionic/vue": "^8.2.0",
    "@ionic/vue-router": "^8.2.0",
    "capacitor-ios-autofill-save-password": "^3.0.0",
    "dayjs": "^1.11.10",
    "firebase": "^10.8.1",
    "ionicons": "^7.0.0",
    "vue": "^3.4.35",
    "vue-router": "^4.4.0"
  },
  "devDependencies": {
    "@capacitor/cli": "^6.0.0",
    "@types/vue": "^1.0.31",
    "@vitejs/plugin-legacy": "^5.0.0",
    "@vitejs/plugin-vue": "^5.0.5",
    "@vue/eslint-config-typescript": "^13.0.0",
    "@vue/test-utils": "^2.3.0",
    "cypress": "^13.5.0",
    "eslint": "^8.57.0",
    "eslint-plugin-vue": "^9.27.0",
    "jsdom": "^24.1.0",
    "terser": "^5.4.0",
    "typescript": "^5.1.6",
    "vite": "^5.0.0",
    "vitest": "^2.0.2",
    "vue-tsc": "^2.0.26"
  },
  "description": "An Ionic project"
}

При запуске команды сборки Ionic я испытываю эту ошибку ниже. Также смотрите комментарии под публикацией. По сути, сборка не продолжается из-за этой ошибки. На прошлой неделе моя IDE высветила ту же ошибку, но сборка все равно прошла успешно.

Module '"vue"' has no exported member 'computed'.ts-plugin(2305)
import computed

Подскажите, пожалуйста, способ размножения. Это могло бы произойти, если бы вы использовали старую версию Vue (2.6 или старше).

Estus Flask 03.08.2024 15:28

@EstusFlask моя версия Vue — «vue»: «^3.4.35». Источник: файл package.json. Что еще я могу предоставить? Воспроизведение сложно, так как это означало бы клонирование всего репо.

Evgeny Pavlov 03.08.2024 15:52

Неизвестно, в какой момент возникает ошибка. Если это происходит только в IDE, но не происходит при сборке, значит, проблема специфична для IDE. См. stackoverflow.com/help/mcve. Не нужно клонировать. Проблема, специфичная для настройки проекта, должна быть воспроизводима с помощью приложения «Hello World», имеющего вашу конфигурацию. Это может быть репозиторий или онлайн, например stackblitz.

Estus Flask 03.08.2024 16:05

@EstusFlask ошибка выделяется во время ионной сборки, если вы это имеете в виду. [Ionic] Сборка... > npx npm run build && npx cap copy > привычка[email protected] build > vue-tsc && vite build src/comComponents/ActivityListItem.vue(40,10): ошибка TS2305: Модуль ' «vue» не имеет экспортированного элемента «ref». src/comComponents/ActivityListItem.vue(40,15): ошибка TS2305: у модуля «vue» нет экспортированного «вычисляемого» элемента. [ошибка] npx npm run build && npx cap copy Failed [ошибка] Ошибка сборки.

Evgeny Pavlov 03.08.2024 18:26

Если это вызвано vue-tsc, это означает, что что-то не так с deps или tsconfig.

Estus Flask 03.08.2024 19:11

@EstusFlask, спасибо! Я добавил файлы tsconfig и package.json выше в исходный пост. Можете ли вы взглянуть?

Evgeny Pavlov 03.08.2024 20:53
Стоит ли изучать PHP в 2026-2027 годах?
Стоит ли изучать PHP в 2026-2027 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
0
6
51
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Ошибка вызвана командой vue-tsc, которая отвечает за проверку типов в проекте.

Проблема в @types/vue зависимости, ее надо убрать. Он предназначен для Vue 1.x и предотвращает попадание встроенных типов в пакет vue, поскольку они распознаются TypeScript.

чувак, это безумие, как ты это понял? чтобы я мог понять это в будущем.

Evgeny Pavlov 03.08.2024 22:14

Современным библиотекам @types вообще не нужен, потому что у них есть встроенные типы. Поскольку версия vue верна, пакет @types/vue будет первым, кто заподозрит это, потому что это единственное, что может повлиять на него при нормальных обстоятельствах с помощью этого tsconfig, если только в src/ нет каких-то странных вещей, которые невозможно воспроизвести. @types/vue также можно было установить с помощью какого-нибудь старого пакета, связанного с vue, и не напрямую, но он был здесь. Я перекинул файлы в только что инициализированный ионный проект, и появилась ошибка, поэтому места для ошибок было не так много, поскольку она была в компиляторе ts, а не в других инструментах.

Estus Flask 03.08.2024 22:30

Также @types обычно соответствуют версии библиотеки, для которой они предназначены. Даже если вы не знаете, нужно ли это библиотеке, «1.0.31» — это большой красный флаг.

Estus Flask 03.08.2024 22:34

Другие вопросы по теме