Razzle: Migration zu Typoskript

Hey, es fällt mir auch schwer, das with-typescript Beispiel mit jsx Dateien zum Laufen zu bringen, um eine progressive Migration bestehender Projekte zu ermöglichen.
Hat jemand eine Idee, wie man dieses Ziel archivieren kann?

Herausgefunden!

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

@babel/typescript zu .babelrc hinzufügen

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

Fügen Sie dies zu razzle.config.js hinzu

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

Erstellen Sie eine 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",
    ]
}

Das war's, jetzt können Sie Erweiterungen in .ts und .tsx umbenennen, um Typskript für diese Dateien zu aktivieren.

Wenn Sie aus der Zukunft hierher kommen, sehen Sie sich das großartige razzle-unterstützte Typoskript-Plugin hier an .