Я делаю переход от 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 для реализации интерфейса полезен, но не всегда работает.
2018 сейчас. Вам не нужно никаких расширений для автоматического импорта в Javascript и TypeScript.
Существует два типа автоматического импорта: быстрое исправление добавления отсутствующего импорта quick fix, которое отображается в виде лампочки при ошибках:
И предложения автоматического импорта. Они показывают элементы предложения при вводе. Принятие предложения автоматического импорта автоматически добавляет импорт в верхней части файла
Оба должны работать из коробки с JavaScript и TypeScript. Если автоматический импорт по-прежнему не работает, откройте вопрос
Я использовал плагин Auto Import, который довольно прост.
Автоматически находит, анализирует и предоставляет код действия и код завершение для всего доступного импорта. Работает с Typescript и TSX.
Вы можете увидеть, как это работает на: https://marketplace.visualstudio.com/items?itemName=steoates.autoimport
Если кто-то недавно сталкивался с этой проблемой, я обнаружил, что мне нужно было добавить параметр, чтобы использовать мою версию машинописного текста для автоматического импорта для работы. Для этого добавьте эту строку в настройки своего рабочего пространства:
{
"typescript.tsdk": "./node_modules/typescript/lib"
}
Затем, открыв файл машинописи в vscode, нажмите номер версии машинописи в правом нижнем углу. Когда появятся параметры вверху, выберите “Использовать версию рабочей области”, а затем перезагрузите vscode.
Теперь авто-импорт должен работать.
Существует проблема с Visual Studio Code, которую вы можете отслеживать и делать пальцами для этой функции. Была также проблема с голосовым сообщением, но я считаю, что они перешли на голосование на вопросы GitHub.
Кажется, им нужны функции автоматического импорта в TypeScript, поэтому его можно использовать повторно. TypeScript проблема автоматического импорта, чтобы отслеживать и видеть здесь.
Взгляните на это первое ДОЛЖНО ИМЕТЬ ДОПОЛНИТЕЛЬНО и установите расширения, которые вам могут понадобиться. И тогда, следующее работает для меня просто отлично.
{
"compilerOptions": {
"target": "es5",
"allowSyntheticDefaultImports": true
}
}
Если вы используете angular, убедитесь, что tsconfig.json не содержит ошибок. (в терминале проблем)
По какой-то причине я удвоил эти строки, и у меня это не сработало
“модуль”: “esnext”,
“moduleResolution”: “узел”,