Получение ошибок компиляции для зависимых файлов TypeScript в WebStorm

Мне интересно, есть ли способ заставить WebStorm показывать мне ошибки компиляции в зависимых файлах TypeScript после редактирования. В качестве примера скажем, что у меня есть Class1.ts следующим образом:

class Class1 {
    foo(n: number): number { return 3; }
}

export = Class1;

А также Class2.ts:

import Class1 = require('./Class1');

class Class2 extends Class1 {

    foo(n: number): number { return 4; }
}

Теперь предположим, что я редактирую Class1.ts и меняю тип параметра foo:

class Class1 {
    foo(n: string): number { return 3; }
}

export = Class1;

Когда я выполняю редактирование и сохранение, я не вижу никаких новых ошибок. Если я переключу фокус на вкладку Class2.ts, появится сообщение «Несовместимое переопределение». Но в идеале я бы хотел каким-то образом увидеть все ошибки, которые я внес во весь проект после внесения изменений. Есть ли какое-то представление, которое я могу включить для этого?


person msridhar    schedule 30.01.2014    source источник
comment
Я не уверен, есть ли способ сделать это автоматически при сохранении, но создание проекта, похоже, вызывает для меня ошибки.   -  person Kyle    schedule 31.01.2014
comment
@ user1308743 спасибо! Я все еще надеюсь, что WebStorm сможет отслеживать зависимости и автоматически перекомпилировать то, что необходимо, при сохранении, как это делает Eclipse JDT для Java.   -  person msridhar    schedule 31.01.2014
comment
WebStorm повторно индексирует файлы при каждом изменении и обновляет ошибки / предупреждения, отображаемые в редакторе в результате анализа кода. Чтобы увидеть все эти ошибки в отдельном окне, запустите Code / Inspect Code. Но обратите внимание, что, в отличие от отметок об ошибках в редакторе, это окно не обновляется автоматически при изменении файла. Поэтому вам нужно вызывать его явно каждый раз, когда вы хотите его обновить. Вы можете назначить этому действию какой-нибудь ярлык и нажать его, точно так же, как вы нажимаете Ctrl + S в Eclipse, чтобы обновить представление проблем :)   -  person lena    schedule 31.01.2014
comment
@ user1308743 Вы говорите, что сборка проекта делает это за вас, где вы выбираете сборку проекта в Webstorm?   -  person Travis    schedule 05.11.2014


Ответы (3)


Подходит ли вам использование внешнего файлового менеджера?

Я обнаружил, что диспетчер файлов webstorm для typescript немного глючит. В результате я отключил диспетчер файлов и просто использовал вместо него grunt-contrib-watch. Он отлично работает и обеспечивает немного больше гибкости, если вам это нужно.

Вы можете сделать что-то вроде этого в своем gruntfile.js:

module.exports = function (grunt) {
    var files = [
            'app/**/*.ts'
        ];

    grunt.initConfig({      
        tslint: {
            options: {
                configuration: grunt.file.readJSON("tslint.json")
            },
            files: {
                src: files
            }
        },
        typescript: {
            base: {
                src: files,
                options: {
                    module: 'commonjs',
                    target: 'es5'
                }
            },
            build: {
                src: ['./app.ts'],
                options: {
                    module: 'commonjs',
                    target: 'es5'
                }
            }
        },
        watch: {
            ts: {
                files: ['app/**/*.ts', 'shared/**/*.ts'],
                tasks: ['typescript']
            }
        }
    });

    // Load Tasks
    grunt.loadNpmTasks('grunt-tslint');
    grunt.loadNpmTasks('grunt-typescript');
    grunt.loadNpmTasks('grunt-contrib-watch');

    // Register Tasks
    grunt.registerTask('default', ['watch']);   
};

Затем при простом запуске grunt будет выполнена команда watch, и вы сможете удалить файловый наблюдатель машинописного текста webstorm. Это даст вам ошибки сборки, которые вы ищете при сохранении.

* Примечание: я оставил tslint в файле grunt, так как рекомендуется регулярно запускать tslint для ваших файлов, но это, конечно, не обязательно. Дайте мне знать, если у вас возникнут вопросы по этому поводу.

person JMac    schedule 29.10.2014
comment
Прохладный! Можно ли при таком подходе по-прежнему перемещаться по ошибкам компиляции в WebStorm? - person msridhar; 29.10.2014
comment
Абсолютно. Вы по-прежнему получите все ожидаемые функции WebStorm - выделение ошибок, сообщения об ошибках при наведении курсора и т. Д. Grunt watcher также будет отображать обратно в файлы .ts в вашем проекте, так что вы сможете видеть номера строк. и имена файлов для ошибок таким образом. - person JMac; 30.10.2014
comment
Хорошо, поэтому я попробовал, и он показывает все ошибки компиляции в окне терминала, где я запускал 'grunt' при сохранении файла. Однако я не вижу никаких ошибок внутри WebStorm. Я неправильно запустил 'grunt'? Или мне что-то еще не хватает? - person msridhar; 31.10.2014
comment
@ManuSridharan Думаю, я неправильно понял ваш предыдущий комментарий. Ошибки в WebStorm не обязательно будут появляться, как в нижнем окне WebStorm, когда вы используете встроенный файловый наблюдатель. Когда вы получаете сообщение об ошибке в своем терминале, оно будет содержать имя файла и строку. Затем вы можете перейти к этому файлу (⌘ + O на Mac), и вы увидите, что ошибка по умолчанию выделена красным цветом. Итак, да, когда вы находитесь в файле в WebStorm, вы можете легко определить ошибку. Однако у вас не обязательно будет предупреждение на лице, если только у вас нет терминала перед вами. - person JMac; 31.10.2014
comment
Ах я вижу. Это хорошее улучшение, но не совсем то, что я ищу. Один из вариантов - запустить это в дополнение к файловому контроллеру, и в этом случае вы все равно будете получать немедленные ошибки для текущего файла, появляющегося в WebStorm (однако, нужно быть осторожным, чтобы не получить поврежденный вывод сборки). В любом случае, большое спасибо за помощь! - person msridhar; 31.10.2014

Все еще ручной процесс, но лучше, чем угадывать, какие файлы вам нужно открыть.

Выберите корневую папку проекта, нажмите Ctrl + Shift + A -> Ctrl + Shift + A, чтобы включить действия, не входящие в меню -> введите «запустить файл» -> выберите «Запуск наблюдателей за файлами» .... Это было частью ответа другому вопрос. (https://stackoverflow.com/a/26779818/1757491)

person Travis    schedule 06.11.2014

WebStorm теперь поддерживает tsconfig. Вам нужно будет настроить файл tsconfig.json, а затем перейти в File / Settings / Languages ​​& Frameworks / TypeScript и установить флажок «Use tsconfig.json». Как только я сделал это, я смог (в конце концов) увидеть ошибки типа в окне компилятора TypeScript. Ошибки не появляются сразу, как в Visual Studio. Но для меня они появляются в течение 15-30 секунд. Кроме того, еще один быстрый и грязный подход - открыть окно терминала в операционной системе или в WebStorm и набрать «tsc --watch». Это говорит компилятору TypeScript немедленно скомпилировать все и показывает любые ошибки. '--Watch' означает, что tsc (компилятор TypeScript) будет продолжать отслеживать все файлы .ts и показывать любые ошибки в окне терминала.

person A2MetalCore    schedule 23.05.2016