Rollup-plugin-typescript2: Mengapa deklarasi antarmuka dihapus?

Apakah ini kesalahan runtime, atau kesalahan TypeScript? Bisakah Anda memposting bagaimana Anda mengekspor antarmuka dari RenderedCell itu sendiri?

Masalahnya adalah file tersebut tidak dibuat sama sekali, dan gagal saat menggunakan perpustakaan di proyek lain.

Tunggu, apakah Anda mengharapkan antarmuka RenderedCell dihasilkan? Dari kode yang Anda posting TypeScript akan mengharapkan file bernama RenderedCell.ts ada satu direktori di atas file saat ini dan itu harus berisi sesuatu seperti ini:

export interface RenderedCell 
{ 
    // ...
}

Bisakah Anda memberikan rincian lebih lanjut tentang struktur proyek Anda? (pohon file, tsconfig, konfigurasi rollup, dll)

ya saya mengharapkannya untuk dihasilkan.

Berikut adalah konfigurasi saya:

menjalankan build : rollup -c -f es -n sq-web-component-table -o dist/sq-web-component-table.es.min.js

Saya tidak meletakkan seluruh pohon karena itu adalah perpustakaan yang cukup besar dan lebih banyak noise daripada sinyal. Tetapi Anda sudah dapat melihat bahwa banyak file tidak dihasilkan di dist.

import typescript from 'rollup-plugin-typescript2';
import uglify from 'rollup-plugin-uglify';
import { minify } from 'uglify-es';

export default {
    entry: './src/index.ts',
    dest: 'dist/sq-web-component-table.min.js',
    sourceMap: true,

    plugins: [
        typescript(),
        uglify({}, minify)
    ]
}

{
  "compilerOptions": {
    "target": "es5",
    "module": "es2015",
    "moduleResolution": "node",
    "declaration": true,
    "noImplicitAny": true,
    "noImplicitReturns": true,
    "outDir": "dist"
  },
  "include": [
    "src/**/*.ts"
  ],
  "exclude": [
    "dist",
    "node_modules",
    "**/*-test.ts"
  ]
}

import {RenderedElement} from "./RenderedElement";
import {RenderedRow} from "./RenderedRow";
export interface RenderedCell extends RenderedElement {
    isMergedCell(): boolean;
    getColspan(): number;
    setColspan(colspan: number): void;
    getParent(): RenderedRow;
}

.
├── src
│   ├── index.ts
│   └── table
│       ├── extensions
│       │   ├── base
│       │   │   ├── FirstTableExtension.ts
│       │   │   ├── LastTableExtension.ts
│       │   │   ├── SectionDispatcher.ts
│       │   │   ├── SectionManager.ts
│       │   │   └── SizeChangeMonitor.ts
│       │   ├── InvalidateEvent.ts
│       │   ├── InvalidateSizesEvent.ts
│       │   ├── RenderedCell.ts
│       │   ├── RenderedElement.ts
│       │   ├── RenderedRow.ts
│       │   ├── RenderedSection.ts
│       │   ├── RenderedTable.ts
│       │   ├── SectionClickedEvent.ts
│       │   ├── support
│       │   │   └── ...
│       │   ├── TableAttributes.ts
│       │   ├── TableExtensionChain.ts
│       │   ├── TableExtensionList.ts
│       │   └── TableExtension.ts
│       ├── model
│       │   └── ...
│       ├── TableRenderingOptions.ts
│       ├── Table.ts
│       ├── util
│       │   └── ...
│       └── view
│           └── ...
├── dist
│   ├── index.d.ts
│   ├── sq-web-component-table.es.min.js
│   ├── sq-web-component-table.es.min.js.map
│   ├── sq-web-component-table.min.js
│   ├── sq-web-component-table.min.js.map
│   └── table
│       ├── extensions
│       │   ├── base
│       │   │   ├── FirstTableExtension.d.ts
│       │   │   ├── LastTableExtension.d.ts
│       │   │   ├── SectionDispatcher.d.ts
│       │   │   ├── SectionManager.d.ts
│       │   │   └── SizeChangeMonitor.d.ts
│       │   ├── InvalidateEvent.d.ts
│       │   ├── InvalidateSizesEvent.d.ts
│       │   ├── RenderedRow.d.ts
│       │   ├── SectionClickedEvent.d.ts
│       │   ├── support
│       │   │   └── ...
│       │   ├── TableAttributes.d.ts
│       │   └── TableExtensionList.d.ts
│       ├── model
│       │   └── ...
│       ├── Table.d.ts
│       ├── util
│       │   └── ...
│       └── view
│           └── ...
├── node_modules
│   └── ...
├── __tests__
│   └── ...
├── package.json
├── rollup.config.js
└── tsconfig.json

Aku mengerti. Apakah lib opensource kebetulan?

Coba buat dengan opsi tersebut:

typescript({ verbosity: 2, clean: true }),

Periksa apakah semua file yang Anda harapkan sedang diproses. Jika deklarasi tiba-tiba mulai dibuat, maka ada masalah cache di suatu tempat.

Jika RenderedCell.ts tidak disebutkan dalam output ( rpt2: transpiling '...' ), tingkatkan verbositas menjadi 3 dan periksa apakah file yang seharusnya diimpor melakukan hal itu. Anda harus melihat sesuatu seperti

rpt2: resolving '../RenderedCell'
rpt2:     to '...'

Jika masalahnya tidak jelas, saya akan menambahkan lebih banyak logging di suatu tempat.

Saya akan senang, mungkin di masa depan :)

Terima kasih atas triknya, saya akan mencoba ini pada hari Senin.

Jika Anda menyetel declaration: false di bagian compilerOptions dari tsconfig Anda dan mengkompilasi ulang, apakah masalahnya hilang? Jika ya, apakah kesalahan yang dilaporkan oleh TSC terkait dengan salah satu file dalam direktori dist? Jika ya adalah jawaban Anda untuk keduanya, apakah kesalahannya hilang jika Anda memasukkan logika non-tipe ke file yang berisi file RenderedCell seperti ekspor fungsi sederhana? Jika ya, maka alasannya adalah bahwa file yang berisi RenderedCell dianggap tidak digunakan dan TypeScript tidak akan pernah menyiapkan deklarasi untuk itu.

Jika semua ini berlaku untuk Anda, saya melihat 2 opsi:

• Berhenti membuat deklarasi untuk bundel Anda.
• Pastikan roll-up tidak akan membuat file terguncang sepenuhnya dengan memperkenalkan perubahan pada file yang tidak terkait dengan jenis. Ya, ini adalah peretasan dan saya harap kami menemukan cara untuk melakukan yang lebih baik

Hai,

maaf atas penundaan yang lama, saya mencoba tip dan trik Anda tetapi saya masih tidak bisa mendapatkan definisi tipe untuk antarmuka yang dihasilkan.

Saya mengubah konfigurasi menjadi typescript({ verbosity: 3, clean: true }) .
Dalam output dari build yang dihasilkan, tidak ada satu pun penyebutan antarmuka RenderedCell .

Saya 100% yakin file ini diperlukan, karena index.d.ts dari perpustakaan secara langsung membutuhkannya dan semua file tetapi antarmuka dibuat, tetapi antarmuka masih dalam impor index.d.ts mengajukan.

Saya akan menyelami kode untuk melihat apakah ada alasan tertentu mengapa file-file itu tidak dibuat.

@wessberg Berhenti membuat deklarasi untuk bundel saya bukanlah pilihan karena ini adalah perpustakaan yang merupakan bagian dari proyek yang lebih besar yang semuanya ditulis dalam TypeScript, jadi jika tidak memiliki pengetikan, itu tidak berfungsi.

Jadi, saya melakukan penyelidikan dan membuat repositori yang mereproduksi kasus saya dengan set konfigurasi minimal: https://github.com/onigoetz/typescript-rollup-experiment

Saya juga menyertakan konfigurasi webpack untuk membandingkan cara kerja webpack.

Pemahaman saya tentang masalahnya adalah ketika rollup-plugin-typescript2 membutuhkan versi file yang dikompilasi (katakanlah index.ts) TypeScript akan mengembalikan file yang dikompilasi dan itu diimpor, tetapi tanpa antarmuka dalam impor.

Itu sebabnya rollup tidak pernah menghasilkan mereka: itu tidak menyadari keberadaan mereka.

Untuk menjalankan repositori, lakukan npm install && npm run build di dalam direktori.

Jika Anda menambahkan:
import "./SomeInterface"; (persis seperti itu, - tanpa ikatan bernama) ke file index.ts , itu akan berfungsi. Melakukannya?

Sayangnya, Rollup tidak memanggil pengendali transformasi dari plugin untuk file hanya deklarasi seperti file yang hanya berisi deklarasi tipe. Hal di atas seharusnya berfungsi karena itu memaksa Rollup untuk mengevaluasi file. Masalah ini: https://github.com/rollup/rollup-plugin-typescript/issues/28 menjelaskan bagaimana dan mengapa masalah ini ada. Secara teoritis, kami dapat secara manual menyelesaikan semua dependensi aplikasi Anda dari titik masuk dan menentukan dependensi yang hanya berisi deklarasi tipe, tetapi tidak ada cara untuk memaksa rollup untuk memanggil kait transformasi (di samping kerugian nyata lainnya seperti banyak tambahan kompleksitas langkah pembangunan ).

Saya khawatir kita tidak bisa berbuat banyak tentang ini tanpa mengubah rollup itu sendiri. "Peretasan" yang saya jelaskan seharusnya berfungsi untuk saat ini.

Ya, baru saja diperiksa, menambahkan import "./SomeInterface"; di repo pengujian memperbaiki banyak hal.

Saat mengimpor tipe saja, TypeScript menghilangkan pernyataan impor dari output js dan rollup tidak melihat file-file itu dan dengan demikian tidak mengirimkannya untuk transpiling.

Saya akan mencoba untuk menipu dan memantau file mana yang TypeScript diminta dari disk vs file mana yang rollup dikirim untuk transpiling. Seharusnya dimungkinkan untuk memaksa-transpile perbedaan dengan definisi hanya bendera. Ini mungkin menghasilkan terlalu banyak file d.ts dalam beberapa kasus saya pikir (untuk hal-hal rollup secara sah terguncang dari pohon misalnya)

Terima kasih telah melihat ke dalamnya, saya juga akan memeriksa apakah saya dapat memberikan kontribusi untuk ini.

@onigoetz , ok, coba proyek Anda dengan master. Periksa apakah deklarasi yang benar dihasilkan, tetapi juga periksa apakah tidak ada yang tidak terduga :)

Luar biasa, Anda benar-benar memperbaikinya saat saya sedang tidur :)

Saya mengujinya dan hampir berfungsi dengan baik.

Hanya ada masalah kecil, tetapi saya pikir itu adalah sesuatu yang tidak dapat kita lawan, pemuat webpack melakukan hal yang persis sama dan daftar file dihasilkan oleh TypeScript itu sendiri.

Sebagai contoh; Jika saya memiliki tiga file di repo saya:

• index.ts mengimpor SomeInterface.ts
• SomeInterface.ts
• nongenerated.ts mengimpor SomeInterface.ts

nongenerated.ts tidak pernah direferensikan tetapi tipenya tetap dibuat.

Keren, terima kasih untuk pengujiannya. Saya akan merilisnya nanti setelah masalah lain dikonfirmasi.

Ya tidak banyak yang bisa kita lakukan saat melewati rollup. Anda seharusnya dapat mengecualikan file-file itu secara manual di opsi exclude , tetapi itu adalah solusi yang buruk.

Oke, di 0.5.1 sekarang

berfungsi dengan baik, cukup konfigurasikan tsconfig.json

{
    "compilerOptions": {
        "module": "es2015",
        "target": "es5",
        "declaration":true,
        "declarationDir": "lib",
        "typeRoots": [
            "node_modules/@six006",
            "node_modules/@types"
        ],
        "lib": [
            "es2015",
            "es2017",
            "es5"
        ],
    },
    "include": [
        "src/index.ts",
        "src/module/**/*.ts"
    ],
    "exclude": [
        "node_modules"
    ]
}

include memberi tahu Anda apa yang harus dihasilkan

YMMV tapi saya membuatnya bekerja seperti ini ...

sebelum

export type MyType = { ... };

setelah

type MyType = { ... };

export { MyType }

Untuk apa nilainya, saya hanya memanggil tsc --emitDeclarationOnly setelah rollup, yang menimpa file deklarasi ke dalam folder build.
di package.json saya

"scripts": {
    "build": "rollup -c",
    "postbuild: "tsc --emitDeclarationOnly"
}