Comment ajouter du texte dactylographié à un projet Asp.Net MVC existant ?[dupliquer]

StackOverflow https://stackoverflow.com//questions/12680486

  •  12-12-2019
  •  | 
  •  

Question

J'adore l'idée derrière TypeScript, mais je n'arrive pas à comprendre comment l'inclure dans un projet ASP.Net MVC.J'ai déjà installé l'extension Visual Studio, mais je n'arrive pas à trouver d'exemple ou de documentation sur la façon d'ajouter *.ts fichiers qui se compilent en *.js des dossiers.

Modifier:En fait, devrais-je reproduire la façon dont l'exemple Win8 .jsproj comprend et poignées .ts des dossiers?Ou cela ne fonctionnera-t-il que pour les projets HTML/JS Win8 ?

Était-ce utile?

La solution

Avertissement: Cette réponse est maintenant assez datée, car Typescript et MVC ont considérablement changé depuis cette réponse.J'essaierai une mise à jour plus tard.- Richcodeur

Grâce à Sohnee pour la réponse.

Vous pouvez ajouter des fichiers TypeScript à un projet existant à l'aide de la boîte de dialogue Ajouter > Nouvel élément.exampleImageVeuillez noter que l'élément « Typescript File » ne réside pas sous le groupe Web mais sous son parent dans ce cas, Visual C#.

Cela devrait ajouter un fichier TypeScript et Visual Studio fera le reste.

Ensuite, vous devez ajouter ces lignes au fichier projet :

 <ItemGroup>
    <AvailableItemName Include="TypeScriptCompile" />
 </ItemGroup>
 <ItemGroup>
    <TypeScriptCompile Include="$(ProjectDir)\**\*.ts" />
 </ItemGroup>
 <Target Name="BeforeBuild">
    <Exec Command="&quot;$(PROGRAMFILES)\Microsoft SDKs\TypeScript\0.8.0.0\tsc&quot; -target ES5 @(TypeScriptCompile ->'&quot;%(fullpath)&quot;', ' ')" IgnoreExitCode="true" />
 </Target>

Cela a parfaitement fonctionné pour moi, mais n'hésitez pas à commenter si vous rencontrez des problèmes.

Autres conseils

C'est exact.tout ce dont vous avez besoin est la cible de construction ms pour créer les fichiers .ts en fichiers .js.L'exemple Win8 montre une cible beforeBuild pour appeler tsc sur tous les fichiers appartenant à itemGroup TypeScriptCompile, qui est défini comme $(ProjectDir)***.ts (ou tous les fichiers .ts de votre projet).

La réplication de ce modèle devrait fonctionner dans n'importe quel projet msbuild, et pas seulement dans les projets Win8.

Voici un échantillon de ce dont je parle :Ajoutez ceci à n'importe quel projet msbuild et vous devriez compiler n'importe quel fichier .ts dans le fichier .js équivalent lorsque votre build démarre.

<ItemGroup> 
   <TypeScriptCompile Include="$(ProjectDir)\**\*.ts" />
</ItemGroup>


<Target Name="TypeScriptCompile" BeforeTargets="Build">
   <Message Text="Compiling TypeScript files" />
   <Exec Command="&quot;$(PROGRAMFILES)\Microsoft SDKs\TypeScript\0.8.0.0\tsc&quot; -target ES5 @(TypeScriptCompile ->'&quot;%(fullpath)&quot;', ' ')" />
</Target>

J'ai créé un package nuget qui ajoute un fichier de cibles msbuild à votre projet.Il exécutera le compilateur tsc et nettoiera sa sortie afin que vous puissiez double-cliquer sur les erreurs dans Visual Studio et accéder au fichier/ligne/colonne.

https://www.nuget.org/packages/Sholo.TypeScript.Build

Vous devez définir l'action de construction dans la fenêtre des propriétés sur « TypeScriptCompile » pour tout ce que vous souhaitez que tsc compile.Après quelques jours de bricolage avec TypeScript, j'ai découvert que les fichiers .ts qui effectuent le référencement doivent être définis sur TypeScriptCompile, mais pas les fichiers qui sont uniquement référencés, mais ymmv.En outre, vous devrez peut-être afficher tous les fichiers et ajouter le fichier .js d'origine.Si vous souhaitez regrouper les fichiers .ts/.js/.d.ts associés, jetez un œil à l'extension VsCommands.Le workflow est également très sympa avec NetDemon/extensions similaires.

Si vous utilisez Regroupement et minification, je viens de publier une implémentation d'IBundleTransform qui compile TypeScript en Javascript.C'est sur GitHub et NuGet (Install-Package TypeScriptBundleTransform).Si vous n’utilisez pas encore le Bundling et la Minification, cela vaut le détour !

mise à jour:

Il suffit d'installer Les essentiels du Web 2012 plugin, vous aurez une compilation automatique lors de la sauvegarde - pour les deux .js et .min.js et une vue divisée soignée pour voir la sortie JavaScript à côté de votre code TypeScript.


C'est une méthode grossière que j'utilise :

Faites un clic droit sur votre projet > Propriétés > Créer des événements

Dans la boîte de pré-construction, collez ceci (construit de manière récursive tous les fichiers .ts du projet) :

forfiles /S /P $(ProjectDir) /m *.ts /c "cmd /c tsc @file"

Pour créer un fichier d’entrée spécifique :

tsc $(ProjectDir)MyScripts/myfile.ts

Je suis sûr qu'il existe une meilleure façon de procéder.

Si vous utilisez le Cadre d'optimisation Web Microsoft ASP.NET (alias Bundling et Minification), puis essayez d'utiliser le Transformateur de paquet avec module installé BundleTransformer.TypeScript.En plus de la compilation du code TypeScript en JS, vous pouvez également produire une minification du code JS généré en utilisant d'autres modules du Bundle Transformer : BundleTransformer.MicrosoftAjax, BundleTransformer.Yui, BundleTransformer.Closure, BundleTransformer.JsMin, BundleTransformer.UglifyJs et BundleTransformer.Packer.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top