Como configurar os FileWatchers do WebStorm para usar o babel e reter a estrutura de diretórios de origem

Question

Gostaria de usar os assistentes de arquivos e macros do WebStorm para transpilar o JavaScript ES2015 para o JavaScript ES5 e replicar a estrutura de diretórios de origem no diretório de destino. Não consigo encontrar uma combinação de variáveis de macro ou outra configuração para permitir isso. Meu projeto é organizado assim:

~/ProjectName/src/app.html
~/ProjectName/src/es2015/app.js
~/ProjectName/src/es2015/services/webapi.js
~/ProjectName/src/es5/app.js
~/ProjectName/src/es5/services/webapi.js

A documentação do Jetbrain recomenda usar $FileDirRelativeToProjectRoot$; , no entanto, acredito que isso pressuponha sua origem na própria raiz do projeto e não em uma subpasta src .

    

Answer 1

Argumentos :

--source-maps --presets es2015 --out-file $ProjectFileDir$/dist/$FileDirRelativeToProjectRoot$/$FileNameWithoutExtension$.js $FilePath$

ou

--source-maps --presets es2015 --out-file $ProjectFileDir$/dist/$FileDirPathFromParent(src)$$FileNameWithoutExtension$.js $FilePath$

Caminhos de saída para atualizar :

$ProjectFileDir$/dist/$FileDirRelativeToProjectRoot$/$FileNameWithoutExtension$.js:$ProjectFileDir$/dist/$FileDirRelativeToProjectRoot$/$FileNameWithoutExtension$.js.map

ou

$ProjectFileDir$/dist/$FileDirPathFromParent(src)$$FileNameWithoutExtension$.js:$ProjectFileDir$/dist/$FileDirPathFromParent(src)$$FileNameWithoutExtension$.js.map