Вопрос:
Я делаю переход от Webstorm к Visual Studio Code. Производительность в Webstorm ужасна.
Код Visual Studio не очень помогает найти нужные мне зависимости и импортировать их. Я делаю это вручную до сих пор, но, честно говоря, я предпочел бы ждать 15 секунд, чтобы webstorm смог найти и добавить мой импорт, который придется копать вручную для него.
Я использую семя angular2 из @minko-gechev https://github.com/mgechev/angular2-seed
У меня есть tsconfig.json в моем baseDir, который выглядит так:
{ «compilerOptions»: { «target»: «es5», «module»: «commonjs», «declaration»: false, «removeComments»: true, «noLib»: false, «emitDecoratorMetadata»: true, «experimentalDecorators»: true, «sourceMap»: true, «pretty»: true, «allowUnreachableCode»: false, «allowUnusedLabels»: false, «noImplicitAny»: true, «noImplicitReturns»: true, «noImplicitUseStrict»: false, «noFallthroughCasesInSwitch»: true }, «exclude»: [ «node_modules», «dist», «typings/index.d.ts», «typings/modules», «src» ], «compileOnSave»: false }
и у меня есть еще один в моем директории src/client, который выглядит так:
{ «compilerOptions»: { «target»: «es5», «module»: «commonjs», «moduleResolution»: «node», «sourceMap»: true, «emitDecoratorMetadata»: true, «experimentalDecorators»: true, «removeComments»: false, «noImplicitAny»: false, «allowSyntheticDefaultImports»: true } }
Я не знаю, почему их два. В проекте angualr seed используются задачи typescript gulp, поэтому я думаю, что компиляция отличается.
Что я могу сделать, чтобы vscode стал более полезным?
Лучший ответ:
Я получил эту работу, установив различные плагины. Вот скриншот моего списка расширений. В большинстве случаев вещи просто импортируются сами по себе, как только я набираю имя класса. В качестве альтернативы появляется лампочка, которую вы можете щелкнуть. Или вы можете нажать F1 и ввести “import…”, и там есть различные варианты. Я использую их все. Кроме того, F1 Implement для реализации интерфейса полезен, но не всегда работает.
Ответ №1
2018 сейчас. Вам не нужно никаких расширений для автоматического импорта в Javascript и TypeScript.
Существует два типа автоматического импорта: быстрое исправление добавления отсутствующего импорта quick fix, которое отображается в виде лампочки при ошибках:
И предложения автоматического импорта. Они показывают элементы предложения при вводе. Принятие предложения автоматического импорта автоматически добавляет импорт в верхней части файла
Оба должны работать из коробки с JavaScript и TypeScript. Если автоматический импорт по-прежнему не работает, откройте вопрос
Ответ №2
Я использовал плагин Auto Import, который довольно прост.
Автоматически находит, анализирует и предоставляет код действия и код завершение для всего доступного импорта. Работает с Typescript и TSX.
Вы можете увидеть, как это работает на: https://marketplace.visualstudio.com/items?itemName=steoates.autoimport
Ответ №3
Если кто-то недавно сталкивался с этой проблемой, я обнаружил, что мне нужно было добавить параметр, чтобы использовать мою версию машинописного текста для автоматического импорта для работы. Для этого добавьте эту строку в настройки своего рабочего пространства:
{ «typescript.tsdk»: «./node_modules/typescript/lib» }
Затем, открыв файл машинописи в vscode, нажмите номер версии машинописи в правом нижнем углу. Когда появятся параметры вверху, выберите “Использовать версию рабочей области”, а затем перезагрузите vscode.
Теперь авто-импорт должен работать.
Ответ №4
Существует проблема с Visual Studio Code, которую вы можете отслеживать и делать пальцами для этой функции. Была также проблема с голосовым сообщением, но я считаю, что они перешли на голосование на вопросы GitHub.
Кажется, им нужны функции автоматического импорта в TypeScript, поэтому его можно использовать повторно. TypeScript проблема автоматического импорта, чтобы отслеживать и видеть здесь.
Ответ №5
Взгляните на это первое ДОЛЖНО ИМЕТЬ ДОПОЛНИТЕЛЬНО и установите расширения, которые вам могут понадобиться. И тогда, следующее работает для меня просто отлично.
{ «compilerOptions»: { «target»: «es5», «allowSyntheticDefaultImports»: true } } Ответ №6
Если вы используете angular, убедитесь, что tsconfig.json не содержит ошибок. (в терминале проблем)
По какой-то причине я удвоил эти строки, и у меня это не сработало
“модуль”: “esnext”,
“moduleResolution”: “узел”,