Razzle: Bermigrasi ke TypeScript

Dibuat pada 14 Apr 2019 · 3Komentar · Sumber: jaredpalmer/razzle

Saya memiliki proyek besar dan ingin mulai bermigrasi ke TypeScript satu komponen pada satu waktu.

Saya telah mencoba --with-typescript tetapi itu mengharuskan saya untuk mengganti nama semua file sekaligus. Saya ingin mengonversi secara perlahan memastikan bahwa file yang belum dikonversi mempertahankan ekstensi awalnya sementara file baru mengadopsi ekstensi file TypeScript.

Bagaimana saya melakukannya di razzle?

Sumber

krazyjakee

👍5

Komentar yang paling membantu

Menemukannya!

npm i -D @babel/preset-typescript ts-loader typescript

Tambahkan @babel/typescript ke .babelrc

"presets": [
    "razzle/babel",
    "@babel/typescript"
]

Tambahkan ini ke razzle.config.js

config.resolve.extensions = config.resolve.extensions.concat(['.ts', '.tsx']);
config.module.rules.push({ test: /\.tsx?$/, loader: 'ts-loader' });

Buat tsconfig.json

{
    "compilerOptions": {
        "experimentalDecorators": true,
        // Target latest version of ECMAScript.
        "target": "esnext",
        // Search under node_modules for non-relative imports.
        "moduleResolution": "node",
        // Process & infer types from .js files.
        "allowJs": false,
        // Enable strictest settings like strictNullChecks & noImplicitAny.
        "strict": false,
        // Disallow features that require cross-file information for emit.
        "isolatedModules": true,
        // Import non-ES modules as default imports.
        "esModuleInterop": true,
        "jsx": "react"
    },
    "include": [
        "src"
    ],
    "exclude": [
        "node_modules",
    ]
}

Itu saja, sekarang Anda dapat mengganti nama ekstensi menjadi .ts dan .tsx untuk mengaktifkan TypeScript untuk file tersebut.

krazyjakee pada 24 Apr 2019

👍3

Semua 3 komentar

Hai, saya juga menghadapi kesulitan mencoba membuat contoh with-typescript bekerja dengan file jsx untuk memungkinkan migrasi progresif dari proyek yang ada.
Adakah yang punya ide tentang cara mengarsipkan tujuan ini?

frosato-dev pada 19 Apr 2019