Код Visual Studio: при начальной установке VueJS не удается найти модуль "@/.."

Question

Как Вам известно @ заполнитель для /src и приложение компилируется и работает правильно, если я использую его так. Но мой VSCode считает, что модуля нет, и показывает сообщение об ошибке:

Вопрос 1: Как я могу научить VSCode, как найти модули?

Аналогичная ситуация следующая:

export default class HelloWorld extends Vue {
  @Prop() private msg!: string;
}

В IDE есть две ошибки (пока приложение компилируется и работает правильно):

1) !: подчеркнут красным -> Ожидается выражение

2) string подчеркнут красным -> член 'string' неявно имеет тип 'any'.

Но это не совсем ошибки, это нормальный синтаксис, и VSCode не может справиться с этим. Vetur Extension (Vue Tooling для VSCode) уже установлен.

Вопрос 2: Как я могу вообще иметь дело с Vue + TypeScript в VSCode? Что (все) я должен рассмотреть?

Answer 1

Импорт *.svg

VS Code не знает, как импортировать svg файл самостоятельно. Чтобы это исправить, добавьте .d.ts файл в корне вашего проекта, содержащий:

declare module '*.svg' {
  const content: any;
  export default content;
}

Я обнаружил, что добавление этой декларации в src/shims.d.ts не работает. Работало только при создании .d.ts файл в корне проекта (например, <root>/index.d.ts).

Expression expected ошибка

Это из Vetur 0.11.7, который использует более старую версию TypeScript, которая не поддерживает определенные утверждения присваивания, введенную в TypeScript 2.7. (vuejs/vetur Выпуск № 723)

Vetur 0.11.8 Preview устраняет проблему, обновляя более новую версию TypeScript, но она еще не выпущена, поэтому вам придется установить VSIX вручную. Простейший метод IMO - использовать раскрывающийся список команд из представления " Расширения кода VS" для установки загруженного vetur-0.11.8.vsix, Исправление доступно в Vetur 0.12.1, который можно установить из представления расширений VS Code.