2017-09-16 1 views
8

Symfony 3.3과 assetic 번들을 사용하고 있습니다. 내 config.yml이 있습니다assetic의 TypeScript 필터에 tsconfig.json을 어떻게 지정합니까?

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

내 타이프 라이터 파일을 컴파일 할 때, 나는이 오류 얻을 : 나는 import { Obj } from './my-obj.model'; 같은 import 문을 사용 후

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'. 

이 발생합니다. import 문을 사용하지 않으면 ts 컴파일이 정상적으로 작동합니다.

assetic의 TypeScript 필터를 --module system 매개 변수 또는 tsconfig.json 매개 변수로 추가하려면 어떻게합니까?

답변

3

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

추가 옵션을 tsc 명령 AsseticBundle을 통해이 순간에 할 수 없습니다.

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

여기 AsseticBundle은 컴파일 할의 tmp 디렉토리/파일에 각 개별 ts 파일을 저장, 그래서 중이 기능을 지원하지 않습니다.

좋은 소식은 assetic.filter.typescript 서비스의 동작을 재정 의하여 해결할 수 있다는 것입니다. 의 응용 프로그램이 클래스를 추가하자

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); 
    } 
} 

그런 다음, 원래의 서비스를 대체 할 매개 변수 클래스의 값을 변경 : 그것은 당신의 assetic 구성으로 나를 위해 일한

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

. 반면에


, 심포니 애플리케이션을 위해 자산을 관리 할 수있는 새로운 권장되는 방법 : Webpack Encoresupport for TypeScript으로, 자바 스크립트 모듈, 전처리 CSS & JS 번들 및 컴파일 및 자산 축소에 당신에게 깨끗한 & 강력한 API를 제공 짐을 싣는 사람.

1

그냥 빈 경로를 TSC에 추가, 해킹을 수행해야합니다 :)

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