web-dev-qa-db-fra.com

Existe-t-il un outil pour convertir les fichiers JavaScript en TypeScript?

Maintenant que TypeScript est sorti, c'est une nouvelle excitante pour moi, mais comment puis-je convertir tous les fichiers JavaScript existants en TypeScript.

typescriptjavascript
117
Gisway

Je crains que cela soit très problématique. TypeScript est un sur-ensemble de JavaScript . Cela implique que tout code JavaScript valide est également un code TypeScript valide. Ce qui est juste faux. Le code suivant est correct en JavaScript, mais crée une erreur dans TypeScript:

var data={x:5, y:6};
data.z=5;

Vous pouvez obtenir le comportement dynamique de JavaScript en déclarant des données "ambiantes".

var data:any={x:5, y:6};
data.z=5;

Maintenant, cela fonctionnera aussi avec TypeScript. Néanmoins, vous pouvez modifier l'extension d'un fichier .js en .ts et le transmettre au compilateur TypeScript. Cela m'a vraiment dérouté et j'ai posé la question dans le canal TypeScript IRC sur freenode. Il s'est avéré que le compilateur TypeScript vérifie son entrée pour la présence de JavaScript valide et ne fait rien au cas où il trouverait quelque chose. Intuitivement, ça sonne bien. Vous devriez être en mesure de "convertir" tout votre JavaScript en TypeScript en mettant simplement à jour les extensions de fichier. Malheureusement, cela ne fonctionne pas comme prévu. Supposons que vous avez ce code:

var func=function(n){alert(n)};

var data={x:5};
data.z=6;

Edit: Je viens d'essayer de compiler ceci et cela ne fonctionne pas. Désolé, il semble que je me suis trompé: le compilateur TypeScript n'accepte même pas le JavaScript pur. Je vais essayer de savoir ce qui ne va pas.

Vous avez changé l'extension de fichier en .ts et utilisez la fonction func dans votre autre code. Au début, tout semble aller pour le mieux, mais ensuite, un vilain bug apparaît. Vous décidez qu'une vérification de type statique vous aiderait probablement et vous modifiez le code en:

var func=function(n:string){alert(n)};

var data={x:5};
data.z=6;

Mais maintenant, ce n'est plus du code JavaScript valide et le compilateur générera beaucoup de messages d'erreur. Après toutes les données n'a pas de membre "z". ... Ce comportement pourrait être évité si le type par défaut spécifiait toujours "n'importe quel", mais alors l'inférence de type serait totalement inutile.

Alors, comment résolvez-vous ce problème? La réponse est: fichiers de déclaration. Vous pouvez utiliser votre code JavaScript "tel quel" dans le projet et toujours obtenir une vérification de type statique à l'aide de quelques fichiers .d.ts. Ils informent le compilateur des variables, méthodes et "classes" déclarées dans un fichier JavaScript, y compris de leurs types. Par conséquent, ils permettent une vérification de type à la compilation et un intellisense fantastique. Un fichier .d.ts pour mon exemple serait

declare var data:any;
declare function func(n:string);

Enregistrez-le sous "myjsfile.d.ts" et importez-le dans TypeScript avec

///<reference path="myjsfile.d.ts"/>

veillez à inclure le script JavaScript dans votre fichier HTML au-dessus du TypeScript compilé. Voici un lien intéressant . Vous pourriez être intéressé par la section "Activer JavaScript en TypeScript".

98
lhk

Mise à jour: l'outil est décrit en détail dans ce post

ReSharper à partir de la version 9 ( versions EAP disponibles ) dispose de fonctionnalités permettant de convertir automatiquement le code JavaScript en TypeScript. Vous pouvez commencer par renommer le fichier .js en .ts et voir les suggestions R # comme celle-ci:

Je n'ai pas essayé sur des exemples réels. Mais il est capable de convertir un grand nombre de modèles JavaScript.

49
Shkredov S.

Du terminal (mac):

for f in *.js; do mv $f `basename $f .js`.ts; done;

Renomme tous les fichiers .js en .ts

C'est un peu ironique - mais comme Benjamin le souligne ci-dessus , les fichiers JavaScript sont valables en TypeScript . Si vous souhaitez ajouter des types, des classes, des interfaces, etc. à votre JavaScript, vous devez vous-même concevoir et modifier votre code à l'aide de ces concepts - peu/pas de conversion automatique pour cela.

Avec GNU findutils (la plupart des * nixes) + Bash, il suffit de faire:

find -type f -name '*.js' -exec bash -c 'mv "${1}" "${1%???}.ts"' bash {} \;
2
7zark7