Rollup.js를 사용할 때의 문제

Question

저는 TypeScript를 배우고 있으며 내보내기/가져 오기 메커니즘을 사용하려고합니다. 나는 3 개 .TS 파일을 가지고 코드로 다음과 같습니다

1) MyClass.ts :

/// <reference path="../Scripts/jquery.d.ts" /> 
/// <reference path="../Scripts/dx.all.d.ts" /> 
/// <reference path="../Scripts/go.d.ts" /> 

export class MyClass { 
    render(divId: string, text: string): void { 
     ... 
    } 
    getData(): void { 
     ... 
    } 
} 

2) Caller.ts :

import { MyClass } from './MyClass'; 

export class Caller { 
    execute() { 
     let myClass: MyClass = new MyClass(); 
     myClass.render("content", "Hello World"); 
     myClass.getData(); 
    } 
} 

3) Main.ts :

import { Caller } from './Caller'; 

window.onload =() => { 
    let caller: Caller = new Caller(); 
    caller.execute(); 
}; 

4) HTML :

<script src="~/Scripts/MyClass.js"></script> 
<script src="~/Scripts/Caller.js"></script>> 
<script src="~/Scripts/Main.js"></script> 

,

5) tsconfig.json :

{ 
    "compilerOptions": { 
     "noImplicitAny": false, 
     "noEmitOnError": true, 
     "removeComments": false, 
     "sourceMap": true, 
     "target": "es5", 
     "outDir": "../Scripts", 
     "allowSyntheticDefaultImports": true, 
     "lib": [ "es2015", "dom" ], 
     "module": "commonjs" 
    }, 
    "exclude": [ 
     "node_modules", 
     "wwwroot" 
    ] 
} 

내가 마지막 단계는 일부 모듈 로더 또는 모듈 들러를 사용하는 것입니다 알고있는 것처럼

. 모듈 bundler 인 Rollup.js를 선택했습니다. Rollaup.js는 내가 작성한 모든 TypeScript (JavaScript) 코드를 포함하는 하나의 번들 파일을 생성해야 함을 이해합니다. 그게 맞습니까?

그렇다면 Rollup.js를 다운로드하고 내 MVC 5 웹 응용 프로그램의 스크립트 하위 폴더 인 .ts, .d.ts, .js 및 기타 파일을 모두 방문했습니다. TypeScript 코드 JQuery, DevExtreme 및 GoJS JavaScript 라이브러리에서도 사용됩니다.

는 그 후 나는 다음 롤업 명령을 사용합니다

rollup Main.js -o bundle.js -f cjs 

내가 Main.js 파일이 진입 점이었고, 롤업이 자동으로 내보내기/가져 오기 의존성을 해결하고 파일 bundle.js 1 개 출력을 만드는 것으로 이해 한을 그

<script src="~/Scripts/bundle.js"></script> 

bundle.js 파일을 생성하지만, Main.js 파일의 내용을 제외하고 아무것도 없다 : 나는 HTML 코드에서이 방법으로 사용할 수 있습니다. 그래서, 이런 식으로 필자는 아무 것도 보여주지 못한다.

여기에 표시된 코드는 문제를 해결하기위한 것으로 실제 코드는 더 복잡합니다.

내가 뭘 잘못 했니?

Answer 1

.ts 파일 (here's an example config)을 미리 컴파일하지 말고 rollup-plugin-typescript을 사용해보십시오. (설정 파일을 사용하려면 rollup -c을 실행하십시오.)