Wie lege ich eine tsconfig.json für den TypeScript-Filter von assetic fest?

Question

Ich benutze Symfony 3.3 und das assetic Bundle. Ich habe dies in meinem config.yml:

assetic: 
    debug:   '%kernel.debug%' 
    use_controller: '%kernel.debug%' 
    filters: 
     cssrewrite: ~ 
     typescript: 
      bin: "%kernel.root_dir%/../node_modules/typescript/bin/tsc" 
      apply_to: "\\.ts$" 

Wenn ich versuche, meine Typoskript Dateien zu kompilieren, ich diesen Fehler:

Output: 
../../../../private/var/folders/94/45yn02792ksfglm12pjxxlp00000gn/T/assetic_typescript_in59bccf08e6357/my-form.ts.ts(6,1): error TS6131: Cannot compile modules using option 'out' unless the '--module' flag is 'amd' or 'system'. 
../../../../private/var/folders/94/45yn02792ksfglm12pjxxlp00000gn/T/assetic_typescript_in59bccf08e6357/my-form.ts.ts(6,22): error TS2307: Cannot find module './my-obj.model'. 

Dies geschieht, nachdem ich eine Import-Anweisungen wie import { Obj } from './my-obj.model'; verwenden. Wenn ich keine import-Anweisungen verwende, funktioniert die Kompilierung gut.

Wie füge ich give assesses TypeScript Filter entweder --module system Parameter oder tsconfig.json?

Answer 1

error TS6131: Cannot compile modules using option 'out' unless the '--module' flag is 'amd' or 'system'.

Zusätzliche Optionen für tsc Befehl durch AsseticBundle ist nicht möglich, im Moment.

error TS2307: Cannot find module './model'.

und hier AsseticBundle jede einzelne ts-Datei in eine, es zu kompilieren tmp dir/Datei speichern, so dass es nicht diese Funktion entweder unterstützen.

Die gute Nachricht ist, dass Sie das Verhalten des assetic.filter.typescript-Dienstes überschreiben können, um es zu beheben. Lassen Sie uns diese Klasse der Anwendung hinzufügen:

namespace AppBundle\Assetic\Filter; 

use Assetic\Asset\AssetInterface; 
use Assetic\Exception\FilterException; 
use Assetic\Util\FilesystemUtils; 

class TypeScriptFilter extends \Assetic\Filter\TypeScriptFilter 
{ 
    private $tscBin; 
    private $nodeBin; 

    public function __construct($tscBin = '/usr/bin/tsc', $nodeBin = null) 
    { 
     $this->tscBin = $tscBin; 
     $this->nodeBin = $nodeBin; 
    } 

    public function filterLoad(AssetInterface $asset) 
    { 
     $pb = $this->createProcessBuilder($this->nodeBin 
      ? array($this->nodeBin, $this->tscBin) 
      : array($this->tscBin)); 

     // using source path to compile and allow "imports". 
     $inputPath = $asset->getSourceRoot().DIRECTORY_SEPARATOR.$asset->getSourcePath(); 
     $outputPath = FilesystemUtils::createTemporaryFile('typescript_out'); 

     $pb 
      ->add($inputPath) 
      // passing the required options here 
      ->add('--module')->add('system') 
      ->add('--out') 
      ->add($outputPath) 
     ; 

     $proc = $pb->getProcess(); 
     $code = $proc->run(); 

     if (0 !== $code) { 
      if (file_exists($outputPath)) { 
       unlink($outputPath); 
      } 
      throw FilterException::fromProcess($proc)->setInput($asset->getContent()); 
     } 

     if (!file_exists($outputPath)) { 
      throw new \RuntimeException('Error creating output file.'); 
     } 

     $compiledJs = file_get_contents($outputPath); 
     unlink($outputPath); 

     $asset->setContent($compiledJs); 
    } 
} 

Dann wird der Wert des Parameters Klasse ändern den ursprünglichen Dienst außer Kraft zu setzen:

# app/config/services.yml 
parameters: 
    assetic.filter.typescript.class: 'AppBundle\Assetic\Filter\TypeScriptFilter' 

Es ist für mich mit Ihrer assetic Konfiguration gearbeitet.

---

In der anderen Seite die neue empfohlene Art und Weise Vermögen für Symfony-Anwendungen zu verwalten: Webpack Encore gibt Ihnen eine saubere & leistungsfähige API zur Bündelung von JavaScript-Module, Vorbearbeitung CSS & JS und Kompilieren und Vermögenswerte minifying, mit support for TypeScript Lader.

Answer 2

Fügen Sie einfach es ist Pfad zum TSC tun sollte den Hack :)

assetic: 
debug:   '%kernel.debug%' 
use_controller: '%kernel.debug%' 
filters: 
    cssrewrite: ~ 
    typescript: 
     bin: "%kernel.root_dir%/../node_modules/typescript/bin/tsc --module system"