Hoe om te kijken en te compileren alle typoscript bronnen?

Typescript 1.5 beta is de steun voor een configuratiebestand genaamd tsconfig.json geïntroduceerd. In dat bestand kunt u de compiler te configureren, te definiëren code opmaak regels en wat nog belangrijker is voor u, te voorzien van informatie over de TS-bestanden in uw project.

Eenmaal correct geconfigureerd, kunt u gewoon lopen de TSC opdracht en hebben het compileren al het typoscript code in uw project.

Als u wilt laten kijken naar de bestanden voor veranderingen dan kun je gewoon toevoegen --watch aan de TSC commando.

Hier is een voorbeeld tsconfig.json bestand

{
"compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "declaration": false,
    "noImplicitAny": false,
    "removeComments": true,
    "noLib": false
},
"include": [
    "**/*"
],
"exclude": [
    "node_modules",
    "**/*.spec.ts"
]}

In het bovenstaande voorbeeld, ik omvatten alle Ts bestanden in mijn project (recursief). Merk op dat u ook bestanden met behulp van een "exclusief" eigenschap met een scala kan uitsluiten.

Voor meer informatie, zie de documentatie: http://www.typescriptlang.org/docs/handbook/tsconfig-json.html

Technisch gesproken heb je een paar opties hier:

Als u gebruik maakt van een IDE zoals Sublime Tekst en geïntegreerde MSN plugin voor Typescript: http://blogs.msdn.com/b/interoperability/archive/2012/10/01/sublime-text-vi-emacs-typescript-enabled. aspx kunt u een build systeem dat het compileren te creëren .tsbron .jsautomatisch. Hier is de uitleg hoe je het kunt doen: Hoe maak je een Sublime Build System configureren voor typoscript .

U kunt zelfs bepalen om de broncode van de bestemming te compileren .jsbestand op Bestand opslaan. Er is een subliem pakket gehost op GitHub: https://github.com/alexnj/SublimeOnSaveBuild die dit te laten gebeuren, maar je moet het onder andere tsextensie in het SublimeOnSaveBuild.sublime-settingsbestand.

Een andere mogelijkheid zou zijn om elk bestand in de command line samen te stellen. U kunt zelfs meerdere bestanden tegelijk samen te stellen door ze te scheiden met spaties als volgt: tsc foo.ts bar.ts. Check this thread: Hoe kan ik pas meerdere bronbestanden aan de typoscript compiler? , Maar ik denk dat de eerste optie is meer handig.

Kijken naar het gebruik grunt om dit te automatiseren, zijn er tal van tutorials rond, maar hier is een snelle start.

Voor een mappenstructuur, zoals:

blah/
blah/one.ts
blah/two.ts
blah/example/
blah/example/example.ts
blah/example/package.json
blah/example/Gruntfile.js
blah/example/index.html

U kunt kijken naar en werken met typoscript gemakkelijk van het voorbeeld map met:

npm install
grunt

Met package.json:

{
  "name": "PROJECT",
  "version": "0.0.1",
  "author": "",
  "description": "",
  "homepage": "",
  "private": true,
  "devDependencies": {
    "typescript": "~0.9.5",
    "connect": "~2.12.0",
    "grunt-ts": "~1.6.4",
    "grunt-contrib-watch": "~0.5.3",
    "grunt-contrib-connect": "~0.6.0",
    "grunt-open": "~0.2.3"
  }
}

En een grunt bestand:

module.exports = function (grunt) {

  // Import dependencies
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-connect');
  grunt.loadNpmTasks('grunt-open');
  grunt.loadNpmTasks('grunt-ts');

  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    connect: {
      server: {  // <--- Run a local server on :8089
        options: {
          port: 8089,
          base: './'
        }
      }
    },
    ts: {
      lib: { // <-- compile all the files in ../ to PROJECT.js
        src: ['../*.ts'],
        out: 'PROJECT.js',
        options: {
          target: 'es3',
          sourceMaps: false,
          declaration: true,
          removeComments: false
        }
      },
      example: {  // <--- compile all the files in . to example.js
        src: ['*.ts'],
        out: 'example.js',
        options: {
          target: 'es3',
          sourceMaps: false,
          declaration: false,
          removeComments: false
        }
      }
    },
    watch: { 
      lib: { // <-- Watch for changes on the library and rebuild both
        files: '../*.ts',
        tasks: ['ts:lib', 'ts:example']
      },
      example: { // <--- Watch for change on example and rebuild
        files: ['*.ts', '!*.d.ts'],
        tasks: ['ts:example']
      }
    },
    open: { // <--- Launch index.html in browser when you run grunt
      dev: {
        path: 'http://localhost:8089/index.html'
      }
    }
  });

  // Register the default tasks to run when you run grunt
  grunt.registerTask('default', ['ts', 'connect', 'open', 'watch']);
}

De TSC compiler zal alleen maar toekijken hoe de bestanden die u passeert op de opdrachtregel. Het zal niet bestanden die zijn opgenomen met behulp van een horloge /// <sourcefile>referentie. Als je het werken met de bash, kunt u gebruik maken vinden recursief vind alle *.tsbestanden en compileren:

find . -name "*.ts" | xargs tsc -w

u kunt alle bestanden als dit horloge

tsc *.ts --watch

TSC 0.9.1.1 lijkt niet te zijn een horloge functie.

je zou kunnen gebruiken een PowerShell script zoals degene die ik maakte op dit bericht:

Automatisch naar te kijken en te compileren typoscript bestanden

Vandaag heb ik ontwierp deze Ant MacroDef voor hetzelfde probleem als de jouwe:

    <!--
    Recursively read a source directory for TypeScript files, generate a compile list in the
    format needed by the TypeScript compiler adding every parameters it take.
-->
<macrodef name="TypeScriptCompileDir">

    <!-- required attribute -->
    <attribute name="src" />

    <!-- optional attributes -->
    <attribute name="out" default="" />
    <attribute name="module" default="" />
    <attribute name="comments" default="" />
    <attribute name="declarations" default="" />
    <attribute name="nolib" default="" />
    <attribute name="target" default="" />

    <sequential>

        <!-- local properties -->
        <local name="out.arg"/>
        <local name="module.arg"/>
        <local name="comments.arg"/>
        <local name="declarations.arg"/>
        <local name="nolib.arg"/>
        <local name="target.arg"/>
        <local name="typescript.file.list"/>
        <local name="tsc.compile.file"/>

        <property name="tsc.compile.file" value="@{src}compile.list" />

        <!-- Optional arguments are not written to compile file when attributes not set -->
        <condition property="out.arg" value="" else='--out "@{out}"'>
            <equals arg1="@{out}" arg2="" />
        </condition>

        <condition property="module.arg" value="" else="--module @{module}">
            <equals arg1="@{module}" arg2="" />
        </condition>

        <condition property="comments.arg" value="" else="--comments">
            <equals arg1="@{comments}" arg2="" />
        </condition>

        <condition property="declarations.arg" value="" else="--declarations">
            <equals arg1="@{declarations}" arg2="" />
        </condition>

        <condition property="nolib.arg" value="" else="--nolib">
            <equals arg1="@{nolib}" arg2="" />
        </condition>

        <!-- Could have been defaulted to ES3 but let the compiler uses its own default is quite better -->
        <condition property="target.arg" value="" else="--target @{target}">
            <equals arg1="@{target}" arg2="" />
        </condition>

        <!-- Recursively read TypeScript source directory and generate a compile list -->
        <pathconvert property="typescript.file.list" dirsep="\" pathsep="${line.separator}">

            <fileset dir="@{src}">
                <include name="**/*.ts" />
            </fileset>

            <!-- In case regexp doesn't work on your computer, comment <mapper /> and uncomment <regexpmapper /> -->
            <mapper type="regexp" from="^(.*)$" to='"\1"' />
            <!--regexpmapper from="^(.*)$" to='"\1"' /-->

        </pathconvert>


        <!-- Write to the file -->
        <echo message="Writing tsc command line arguments to : ${tsc.compile.file}" />
        <echo file="${tsc.compile.file}" message="${typescript.file.list}${line.separator}${out.arg}${line.separator}${module.arg}${line.separator}${comments.arg}${line.separator}${declarations.arg}${line.separator}${nolib.arg}${line.separator}${target.arg}" append="false" />

        <!-- Compile using the generated compile file -->
        <echo message="Calling ${typescript.compiler.path} with ${tsc.compile.file}" />
        <exec dir="@{src}" executable="${typescript.compiler.path}">
            <arg value="@${tsc.compile.file}"/>
        </exec>

        <!-- Finally delete the compile file -->
        <echo message="${tsc.compile.file} deleted" />
        <delete file="${tsc.compile.file}" />

    </sequential>

</macrodef>

Gebruik het in uw build bestand:

    <!-- Compile a single JavaScript file in the bin dir for release -->
    <TypeScriptCompileDir
        src="${src-js.dir}"
        out="${release-file-path}"
        module="amd"
    />

Het wordt gebruikt in het project PureMVC voor typoscript waar ik aan werk op het moment dat het gebruik van WebStorm.